Question

I am using Jeditable,

http://www.appelsiini.net/projects/jeditable

And DataTables,

http://datatables.net/download/

To try and make an live editable table but whenever I edit, it does not post the row ID that I am getting it from so I want to try and pull the right ID when you edit a column. However, no matter what I try it does not seem to get anything. Any ideas?

Code:

 $(document).ready(function() {

          var oTable = $('#example').dataTable( {
         "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "scripts/getData.php",
        "fnDrawCallback": function () {
            $('#example tbody td').editable( 'examples_support/editable_ajax.php', {
                "event" : 'dblclick',
                "tooltip" : 'Click to edit.',
                "submitdata" : {id: $(this).parent().index()},
                "callback": function( sValue, y ) {
                console.log(sValue);
                console.log($(this).parent().index());
                console.log($(this).parent().find('td:eq(3)').html());
                    /* Redraw the table from the new data on the server */
                    oTable.fnDraw();
                },
                "height": "14px"
            } );
        }
        } );
    } );

In this particular example, submitdata returns 1 while the console.log in teh callback returns the correct info.

Answer 1

Try wrapping the submitdata object in a function to keep this in scope…

    ...
    "submitdata" : function() {return {id: $(this).parent().index()}},
    ...

It worked for me, hope that helps.

Cheers.