.trigger() not working on jeditable plugin inline editor

76 views Asked by At

I have a search function and it adds elements on keyup, it is working on elements that are not appended or originally in the DOM.

here is where i add new elements through ajax

foreach ($posts as  $post) {
                $output .= "<tr><td>".$post->registration_date."</td>".
                           "<td class='edit'>".$post->pat_bdate."</td>".
                           "<td class='edit'>".$post->pat_lname."</td>".
                           "<td>".$post->pat_fname."</td>".
                           "<td>".$post->weight."</td>".
                           "<td>".$post->height."</td>".
                           "<td>".$post->age."</td>".
                           "<td>".$post->sex."</td>".
                           "<td>".$post->mother_name."</td>".
                           "<td>".$post->address."</td>".
                           "<td><a href='posts/".$post->id."'><p>View Profile</p></a><td>".
                           "<td><a href='checkup/".$post->id."'><p>Check  Up</p></a><td></tr>";

            }

Here is the event that triggers the .editable but its not working on new added elements. But its working on elements that are originally there already

 $(document).on('click', ".edit", function () { 

   $(this).trigger('edit');

});

$('.edit').editable('posts/update', {

  event: 'edit',
 select : true,
 submitdata : function(value, settings) {
   return {_method: "PUT",_token:token,col:$(this).attr("class").split(' ')[1]};

}

The search ajax

$.ajax({
      type: 'GET',
      url: url,
      data: {search:value},
      success: function(data){
        if (value == '') {
            $("#p_list tr").show();
            $("tbody#search").html('');
        }else if (data.no!=="") {
          $("#p_list tr").hide();
            $("tbody#search").html(data);

        }

      }

    });
0

There are 0 answers