0

At the moment I am loading content into a modal dependant on the data-id attribute. This works fine and loads the relevant lists. I am also trying to add a link to a list if the .current_list is clicked and this is the part which doesn't seem to be working. When I click nothing happens and I don't see any errors in developer tools network tab.

The question is can anyone see why the .current_list wouldn't be recognizing a click? Or anything else which may affect the code.

Here is the view before any ajax content is loaded:

Timeline View:

<div id="innerContent">
<div id="mainContent">

<?php

    foreach($links->result_array() as $link){

        echo ''.$link['title'].'<br><br>';

?> 

<a data-toggle="modal" href="#myModal" class="btn btn-primary btn-lg md-btn" data-id="<?php echo $link['current_link_id'] ?>">Add to List</a>

<?php           

    }

?>

AJAX Modal View:

<div class="modal-dialog">
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
      <h4 class="modal-title">Add link to one of your lists</h4>
    </div>
    <div class="modal-body">

      <?php 



      if(!$this->session->userdata('is_logged_in')){

         echo "You are not logged in. <br><br> <a href=\"/signin\" class=\"floatLeft\"><div class=\"submitButton\">SIGN IN</div></a><a href=\"/signup\" class=\"floatLeft\"><div class=\"submitButton\">SIGN UP</div></a>";

      }else{

         $curr_user = $this->session->userdata('id');            

         echo "<div class=\"current_user dinnyDisplay\">".$curr_user."</div>";
         echo "<div class=\"current_title dinnyDisplay\">".$link['title']."</div>";
         echo "<div class=\"current_url dinnyDisplay\">".$link['url']."</div>";                      

         foreach($lists->result_array() as $list){

            echo "<div class=\"current_list\">";
            echo "<div class=\"this_list_id dinnyDisplay\">".$list['id']."</div>";
            echo $list['list_title'];
            echo "</div>";

         }

      }

      ?>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->

jQuery:

$(".current_list").click(function(event){
    event.preventDefault();
    var $this = $(this);

        $.ajax({
             type: "POST",
             url: base_url + "links/add_link_to_current_list",
             data: {
                 curr_user: $this.siblings('.current_user').html(),
                 curr_list: $this.children('.this_list_id').html(),
                 link_title: $this.siblings('.current_title').html(),   
                 link_url: $this.siblings('.current_url').html()
             },
             dataType: "text",  
             cache:false,
             success: 
              function(data){
                $this.parents('.modal-body').fadeIn().html("Link Added to List");       
              }     

         });                

    return false;
});     

$(".md-btn").click(function(event){
    event.preventDefault();
    var $this = $(this);

        $.ajax({
             type: "POST",
             url: base_url + "timeline/get_curr_users_lists",
             data: {
                 link_id: $this.data('id')
             },
             dataType: "text",  
             cache:false,
             success: 
              function(data){
                $('.modal').remove();   
                $('<div class="modal fade"></div>').html(data).modal();     
              }     

         });                

    return false;
});

If you need more info please comment.

Any help is appreciated.

4

1 回答 1

2

我认为这是因为您的 current_list 已动态添加，因此 jquery 在旧文档中找不到它。

您必须使用.on函数或.live函数（如果您使用较旧的 jquery 版本 < 1.7，则为 .live）。

尝试改变 $(".current_list").click(function(event){

和

$(document).on('click', '.current_list', function(event){

或者

$(".current_list").live("click", function(event){

于 2013-10-28T16:38:38.110 回答