Can't manipulate all fields on preSubmit

ECOH MEDIA

Hi All,
i'm trying to manipulate my row before datatable editor perform the submit.

My table is made of 3 fields:
FieldA
FieldB
FieldC

and this what i've:

table.on( 'click', 'tbody td:not(:first-child)', function (e) { 
  paintingsTableEditor.inline( this, {
                   submit: 'all'           
   } );

   paintingsTableEditor.on( 'preSubmit', function ( e, data, action ) {
       console.log (data);   
  } ); 
} );

When i change a value from the datatable, in the console log i can see the data object which contains only the field i've changed but i would like to manipualate also the others fields.

Can anyone help me how to resolve this problem?

allan

What version of Editor are you using? If not 1.5.5, could you update please. If that doesn't resolve the issue, could you link to the page so I can debug it please.

Allan

ECOH MEDIA

My Editor version is 1.5.5 and unfortunally i'm working on a complex project locally.
Next you can see my code where when the user choose a type of paint (by a select field in "item_painting.painting_id") then, on preSubmit, i would to calculate a cost:

var paintingsTableEditor;
 $(document).ready(function() {
    paintingsTableEditor = new $.fn.dataTable.Editor( {   
            ajax: '/item-paintings/ajax/38' ,    
            table: '#paintingsTable',     
            fields: [
                        {label: "painting", name: "item_painting.painting_id", type: "select"},
                        {label: "cost", name: "item_painting.cost"},
                        {label: "item_id", name: "item_painting.item_id", type: "hidden", data: "38", def: "38"}
                    ]   
    } );`
$('#paintingsTable').on( 'click', 'tbody td:not(:first-child)', function (e) { 
     paintingsTableEditor.inline( this ); 
  } )
var table =  $("#paintingsTable").DataTable( {
    columnDefs: [ {orderable: false, className: "select-checkbox", targets:   0}],
    select: { style:    "multi", selector: "td:first-child" },
    keys: {    columns: ':not(:first-child)',    keys: [ 9 ]  },
    buttons: [ { extend: "print", className: ""},{ extend: "create", editor: paintingsTableEditor},{ extend: "remove", editor: paintingsTableEditor}, ],
    sDom: "lBRfrtip",
    autoWidth: false,
    language: { "url": "/languages/it.json" },
    ajax: "/item-paintings/ajax/38",
    fnRowCallback: function( nRow, aData, iDisplayIndex ) {nRow.setAttribute("id",aData["id"]);},
    columns: [
        { data: null,
         defaultContent: '',
         className: 'select-checkbox',
         width: '50px',
         orderable: false},
        { data: "painting.name", editField: "item_painting.painting_id",  className: "" },
        { data: "painting.thickness",  className: "" },
        { data: "painting.density",  className: "" },
        { data: "item_painting.cost",  className: "" },
        { data: "item_painting.item_id",  className: "", "visible": false }]
} );
// Inline editing on tab focus 
 table.on( 'click', 'tbody td:not(:first-child)', function (e) { 
        paintingsTableEditor.inline( this, { 
           submit: 'all' 
        } ); 
        paintingsTableEditor.on( 'preSubmit', function ( e, o, action ) {   
            console.log (o);   
            o.data.item_painting.cost = '8888'; 
        } );  
 });
});

but it doesn't work. On console log i can see the only field i'm changing and i can't see all the other fields in the row

allan

Thanks for the code.

I think the issue is that you have:

$('#paintingsTable').on( 'click', 'tbody td:not(:first-child)', function (e) {
     paintingsTableEditor.inline( this );
  } )

AND

table.on( 'click', 'tbody td:not(:first-child)', function (e) {
        paintingsTableEditor.inline( this, {
           submit: 'all'
        } );
       ...
} );

The second one won't be executing since DataTables doesn't emit a click event and table is a DataTables' API method. I would suggest removing that event listener and modifying the first one to use submit: 'all'.

Allan

ECOH MEDIA

Ok thank you, it works!