Using Editor inline with Ajax ..

rob morning

using Editor with a single editable column and two check boxes on my row ..

  $('#despatchEntryDetails').
            on('click', 'tbody td.is_editable', function (e) {
                editor.inline(this, {
                    submitOnBlur: true
                }).
                on('submitSuccess', function (e, json, data) {
                    console.log("refreshing  .. ");
//                    var table = $('#despatchEntryDetails').DataTable();
//                    table.ajax.reload(null, false);
//                    table.draw();
                });
            }).
            on('change', 'input.editor-eod', function () {
                editor.edit($(this).closest('tr'), false)
                        .set('endOfDay', $(this).prop('checked') ? true : false)
                        .submit();
            }).
            on('change', 'input.editor-closed', function () {
                editor.edit($(this).closest('tr'), false)
                        .set('closedSlot', $(this).prop('checked') ? true : false)
                        .submit();
            }).

The check boxes work fine BUT my editable field results in the 'submitSuccess' function being called multiple times with what looks to be the same event (same timestamp etc). Can someone confirm the syntax is correct ? Is there anything i'm missing ?

Thanks

Sorry , should probably have added that there is only one column with the class 'td.is_editable' .. (from the associated datatable definition) ..

  columnDefs: [{
                    "targets": [1],
                    "className": "is_editable"
                }],

allan

For every click on the editable fields you are adding another submitSuccess event handler. So on the first click there will be one, on second two, etc.

I presume that is not what you want. Probably best to move the event handler outside the click event.

Allan

rob morning

Thanks .. got it working .. As you can probably tell i'm learning javascript as I go but the datatables / editor are a godsend ..

rob morning

Spoke too soon .. I separated out the event handler, so I know have ,,

 editor.on('submitSuccess', function (e, json, data) {
        var table = $('#despatchEntryDetails').DataTable();
        table.ajax.reload(null, false);
        table.draw();
          console.log("submitSuccess");
    });

Now after I edit a couple of cells correctly further edits result in the cell opening but immediately closing and the event being fired . Any ideas ?

allan

You shouldn't need to call ajax.reload() on submitSuccess, nor draw(). That should all happen automatically, assuming the server is returning information about the updated row - per the client / server comms.

Allan

rob morning

The individual row is correctly updated BUT I then need to download the page again because changing the record effects subsequent entries in the table which are recalculated on the server side ..

allan

Got it.

Are you able to give me a link to the page - there shouldn't be any reason for it to lock up. The best I can think of is that the events get themselves confused!

Allan

rob morning

Thanks for the quick reply .. Unfortunately not, it's an internal manufacturing system ! It's not a huge problem , the screen wont be used that often and probably not in the manner I was using it .. I could maybe create a small stand alone version and play with that to see if i can reproduce it and left you have a look if it proves to be a continuing problem .. Thanks again for your help ..

allan

Okay - sounds good :-)

Allan