如何通过ajax加载模态

Question

I have a problem and i do not know how to describe it, I have index page with a lot of modal,now i do not include all modal when page would load, i want to load that modal by ajax when click their links, now i send a request to a controller by ajax and return renderPartial

return View::make('index.edit_language')
->with('languageinfo',LanguageInfo::where('user_id',$id)->get());

and ajax function

$.ajax({
    type: "POST", 
    url : "modal/lang",
    success : function (data) {  
        // alert('ok');
        $("#links").html(data); 
        $('#edit_lang_Modal').modal();
    }
 });

now every thing works good but when show that modal,js does not work!! it means when i click a link like this

<div class="mre_repeat_item lang_mre_repeat_item">
    <a href="#">add +</a>
</div>

<script type="text/javascript">
    $('#lang_mre_repeat_item').click(function() {
        alert('ok');
    });
</script>

it does not work. i hope you could understand me!!thanks

Answer 1

Is it a selector issue? You define the div like this: add +

And you register event listener like this:

<script type="text/javascript">
    $('#lang_mre_repeat_item').click(function() {
        alert('ok');
    });
</script>

I assume it should be:

<script type="text/javascript">
    $('.lang_mre_repeat_item').click(function(event) {
        event.preventDefault();
        event.stopImmediatePropagation();
        $.ajax({
            type: "POST", 
            url : "modal/lang",
            success : function (data) {  
                // alert('ok');
                $("#links").html(data); 
                $('#edit_lang_Modal').modal();
            }
        });
    });
</script>