Row removal default dialog

neustar

I am creating my editor similar to the rest example and create and edit are working well but I can't seem to deal withe the delete confirmation dialog that pops up. My servlet does not receive the data[] parameter map that works well in create and edit mode. I've tried various ways of intercepting the editor_remove event but I don't understand where a.editor_remove is defined. I need to get the data [] parameter map sent to the server after the confirm dialog. Where can I do that??

var editor; 
$(document).ready(function() {
    editor = new $.fn.dataTable.Editor( {
        ajax: {
            create: {
                type: 'POST',
                url:  '/DuoWeb/web?req=addcust'
            },
            edit: {
                type: 'POST',
                url:  '/DuoWeb/web?req=modcust'
            },
            remove: {
                type: 'POST',
                url:  '/DuoWeb/web?req=delcust'
            }
        },
        table: "#example",
        fields: [ {
                label: "ID:",
                type: "readonly",
                name: "id"
            }, {
                label: "name:",
                //type: "readonly",
                name: "name"
            }, {
                label: "Active:",
                name: "active"
            }, {
                label: "Notes:",
                name: "notes"
            }, {
                label: "aggrcc1:",
                name: "aggrcc1"
            }, {
                label: "aggr Intl:",
                name: "aggrintl"
            }, {
                label: "aggr CSC:",
                name: "aggrcsc"
            }, {
                label: "Email:",
                name: "email",
            }, {
                label: "Domain:",
                name: "domain"
            }
        ]
    } );
    
    $('#example').on('click', 'a.editor_remove', function (e){          ///    <<<<<<<<< this fails. 
        e.preventDefault();
        editor.message("Are you sure you want to remove this row?");
        editor.remove($(this).parents('tr')[0], 'Delete row', {
            "label": "Confirm",
            "fn": function (){this.submit();}
        });
    });
    
 /*   editor.on( 'preSubmit', function ( e, o ) {
        if (( o.data.active != 'Y' ) && ( o.data.active != 'N' )) {
            this.error('active', 'Active must be Y or N');
            return false;
        }
        // ... etc
    } );*/

    //disable name field for edits. it is writable on creates by dflt
    editor.on( 'onInitEdit', function () {
          editor.disable('name');
    } );
    
 
    
    $('#example').DataTable( {
        dom: "Tfrtip",
        "processing": true,
        "ajax": "/DuoWeb/web?req=cust2",
        "columns": [
                    
                    { "data": "id" },   //matches the json returned from server
                    { "data": "name" },  
                    { "data": "active" },
                    { "data": "notes" },
                    { "data": "aggrcc1" },
                    { "data": "aggrintl" },
                    { "data": "aggrcsc" },
                    { "data": "email" },
                    { "data": "domain" }
                ],
                "order": [[1, 'asc']],  
         tableTools: {
            sRowSelect: "os",
            aButtons: [
                { sExtends: "editor_create", editor: editor },
                { sExtends: "editor_edit",   editor: editor },
                { sExtends: "editor_remove",   editor: editor }
                
            ]
        },
        
        
    } );
} );

allan

Hi,

On delete Editor doesn't actually send a data parameter - only action and an array of id (i.e. id[]) parameters. There is an example shown in the documentation here.

The reason that data is not sent is that it simply isn't needed - we just need the list of ids to delete and they will be removed regardless of the data in them.

Regards,
Allan

neustar

Thanks, Alan. Editor/DT is refreshingly clean which I really like btw, but in this case row_29 won't help. Am just using a rest interface to a servlet and it needs something like data[customer_id]. row_29 won't have meaning on the server side. Also there is something funny in that the Delete button isn't always firing an event. Sometimes it is ignoring the button. Plus I'd like to change the confirmation text. So I need to intervene.
I can do 'editor.on( 'onInitEdit', function () ...' but tried duplicating that for onInitRemove without luck. Where can I modify this behavior?

allan

it needs something like data[customer_id]. row_29 won't have meaning on the server side

You can use preSubmit to modify the data sent to the server. For example you could just copy the id array to data. Or copy it item by item, removing the prefix, or whatever the REST interface you are working with expects.

Also there is something funny in that the Delete button isn't always firing an event.

Can you link to a test case showing that so I can debug it please?

Plus I'd like to change the confirmation text.

Use i18n.remove.confirm.

Allan

neustar

I hate to be dense, and js is not my friend, but in debugger all I see is that id[0]="" although I have selected/highlighted a row prior to Delete. There must be some way to get delete to play nice like create and edit

allan

Can you link me to the page so I can debug it please? Also if you could show me the code you are using for preSubmit that might be useful.

I'd expect something like:

editor.on( 'preSubmit', function (e, data, action) {
    if ( action === 'remove' ) {
        data.data = data.id;
    }
} );

Allan

neustar

Alan, here is a link. I had to upload to a public server which took a bit.
http://duo.neustar.biz:8080/DuoWeb/admin/cfg/EditCust.html

when I click on teh 'foo' customer and breakpoint the preSubmit (with change you recommended) I still do not see any real data to grab. Thanks.

allan

Thanks for the link - I see the problem now. There is no id for the tr row elements which is causing the issue, and Editor hasn't been told to source the id from anywhere else, so it can't uniquely identify each row.

As you have the id in the id property of the row, what you can do is use idSrc and set it to be id to tell Editor to get the id from that property. Then the data submitted to the server will be an array of that data for the selected rows.

Allan

neustar

Eureka! Thanks much.