Edit window does not show row selected

e8416o8

Here is the code excerpt:
When Edit button is clicked, "initEdit" alert is displayed and the selected row is shown on console.
So I know initEdit event was fired.
Even I have editor.show(), data are not shown.
How can I display a selected row in the edit entry window?

...

editor.on('initEdit', function(e, json, data) {
    var modifier = editor.modifier();  // Gets the selected row of the table
    if ( modifier ) {
        // Get data for this row
        var table = $('#payers').DataTable();
        var data = table.row( modifier ).data();
        editor.show(); //Shows all fields
        console.log( modifier );
        console.log( data );
        alert( 'initEdit' );
    }

});

...

Thanks,
Karen

e8416o8

Another try.
This does not even show the alert messages for New, Edit, and Remove.
I think the object references (.b_create, .b_edit, and .b_remove) could be wrong.
How can I refer to the buttons?

var editor; // use a global for the submit and return data rendering in the examples
 
$(document).ready(function() {
    editor = new $.fn.dataTable.Editor( {
        serverSide: true,
        ajax: '/myPayers/DataTableServlet',
        table: '#payers',
        idSrc:  0,

        fields: [ {
                label: "PUID:",
                name:  "id"
            }, {
                label: "Payer ID:",
                name:  "payerID"
            }, {
                label: "Payer Name:",
                name:  "payerName"
            }, {
                label: "Rate Schedule:",
                name:  "rateSchedule"
            }, {
                label: "Ins Co:",
                name:  "insCo",
            }, {
                label: "Ins Type:",
                name: "insType",
            }, {
                label: "Ins Group ID:",
                name: "groupID",
            }, {
                label: "Effective:",
                name: "eff",
                type: "date"
            }, {
                label: "Termination:",
                name: "term",
                type: "date"
            }
        ]
    } );

    // New record
    $('.b_create').on('click', function (e) {
        e.preventDefault();
        alert("Create");
        
        editor.create( {
            title: 'Create new record',
            buttons: 'Add'
        } );
    } );
 
    // Edit record
    $(".b_edit").click(function(e)  {
        e.preventDefault();
        alert("Edit");
        editor.edit( $(this).closest('tr'), {
            title: 'Edit record',
            buttons: 'Update'
        } );
    } );
 
    // Delete a record
    $(".b_delete").click(function(e)  {
        e.preventDefault();
        alert("Delete");
 
        editor.remove( $(this).closest('tr'), {
            title: 'Delete record',
            message: 'Are you sure you wish to remove this record?',
            buttons: 'Delete'
        } );
    } );
    
    $('#payers').DataTable( {
        
        dom: 'Bfrtip',
        type: 'POST',
        bServerSide: true,
        sAjaxSource: '/myPayers/DataTableServlet',
        idSrc:  0,
        bProcessing: true,
        spagingType: 'full_numbers',
        bJQueryUI: true,

        columns: [
                  
            { data: 0, "sortable": false, "visible": false},  // PyrContractUID
            { data: 1},   // payerID
            { data: 2},   // payerName
            { data: 3},   // rateSchedule
            { data: 4},   // insCo
            { data: 5},   // insType
            { data: 6},   //  groupID
            { data: 7},   //  eff
            { data: 8}    //  term
        ],
        
        columnDefs: [ 
                     { "targets": "rateSchedule",  
                       "defaultContent": "",
                     },
                     { "targets": "insCo",  
                         "defaultContent": "",
                       },
                     { "targets": "insType", 
                         "defaultContent": "",
                     },
                     { "targets": "groupID", 
                         "defaultContent": "",
                     }
        ],                     

        select: true,
        buttons: [
            { extend: "create", editor: editor },
            { extend: "edit",   editor: editor },
            { extend: "remove", editor: editor }
        ],
    });
    
    
  
  
/*    
    editor.on('initEdit', function(e, json, data) {
        var modifier = editor.modifier();  // Gets the selected row of the table
        if ( modifier ) {
            // Get data for this row
            var table = $('#payers').DataTable();
            var data = table.row( modifier ).data();
            editor.show(); //Shows all fields
            console.log( modifier );
            console.log( data );
            alert( 'initEdit' );
        }

    });
    
    editor.on( 'edit', function ( e, json, data ) {
        alert( 'Edit requested' );
        var modifier = editor.modifier();  // Gets the selected row of the table
        if ( modifier ) {
            // Get data for this row
            var data = table.row( modifier ).data();
            console.log( data );
            alert( 'Edit requested' );
        }
    } );
*/
   
    
} );

.