jquery - closest('tr') not working with Jeditable -

i using plugin jeditable , not understand why parameters not in request.

html before rendering:

<tbody>     @foreach ($liste_eleve_note $eleve_note)     <tr data-user-id="{{{ $eleve_note->id_personne }}}">         <td>{{{ $eleve_note->nom }}}&nbsp;{{{ $eleve_note->prenom }}}</td>         <td class="edit_area" >{{{ $eleve_note->note_num }}}</td>         <td class="edit_area" >{{{ $eleve_note->appreciation }}}</td>     </tr>     @endforeach </tbody> 

rendered html:

<tbody>     <tr data-user-id="3">         <td>hackett&nbsp;steve</td>         <td class="edit_area" >22.00</td>         <td class="edit_area" ></td>     </tr>     <tr data-user-id="106">         <td>brufford&nbsp;bill</td>         <td class="edit_area" >0.00</td>         <td class="edit_area" ></td>     </tr>     <tr data-user-id="107">         <td>lennon&nbsp;john</td>         <td class="edit_area" ></td>         <td class="edit_area" ></td>     </tr> </tbody> 

jquery:

$('.edit_area').editable($('#url_for_ajax').val()+'/edit_note_epreuve', {     indicator : 'saving...',     tooltip   : 'click edit...',     onblur : 'submit',     submitdata : {           'user_id'       : $(this).closest('tr').data('user-id'),         'id_epreuve'    : $('#id_epreuve').val(),         '_token'        : $('meta[name="_token"]').attr( 'content' )     },     onerror : function(settings,original,xhr) {         alert("it wasn't possible edit. try again");         console.log("xhr status: " + xhr.status);     }  }); 

the request sent server:

the parameter user_id missing. have parameters id , value automatically added plugin, , have parameters _token , id_epreuve have been added javascript.

but not parameter user_id.

why happening?

it seems $(this).closest('tr').data('user-id') expects this set td.edit_area you’re calling editable() on… written, you’re using whatever this when make $('.edit_area').editable() call. if this outside <tr> tag, closest() won’t find data-user-id, may exclude post.

this may fix (note: untested!)

$('.edit_area').each(function(){     $(this).editable($('#url_for_ajax').val()+'/edit_note_epreuve', {         indicator : 'saving...',         tooltip   : 'click edit...',         onblur : 'submit',         submitdata : {                'user_id'       : $(this).closest('tr').data('user-id'),              'id_epreuve'    : $('#id_epreuve').val(),              '_token'        : $('meta[name="_token"]').attr( 'content' )         },         onerror : function(settings,original,xhr){             alert("it wasn't possible edit. try again");             console.log("xhr status: " + xhr.status)}      }); });