Inline editing does not work on my script.

davidjmorin

I am trying to get the inline editor working for my script. I am unable to see why this is not working as I have copied it exactly from the example page.

/**
 * @Author: David Morin
 * @Date:   11-06-2020
 * @Email:  davidm@.net
 * @Filename: table.sku_request.js
 * @Last modified by:   David Morin
 * @Last modified time: 2021-04-15 21:20:26
 * @Copyright: IM - 2020
 */


(function($) {

    var editor; // use a global for the submit and return data rendering in the examples
 
    $(document).ready(function() {
        editor = new $.fn.dataTable.Editor( {
            ajax: "php/table.id.php",
            table: "#idRequest",
            fields: [ {
                label: "Completed:",
                name: "complete",
                type: "checkbox",
                separator: "|",
                options: [{
                    label: '',
                    value: 'Yes'
                },]
            },
            {
                label: "Fios Update:",
                name: "fios",
                type: "checkbox",
                separator: "|",
                options: [{
                    label: '',
                    value: 'Yes'
                },]
            },
            {
                label: "E-Mail ID:",
                name: "email_id",
    
            },
            {
                label: "Native Worker ID:",
                name: "native_worker_id",
    
            },
            {
                label: "SSOID:",
                name: "ssoid",
    
            },
            {
                label: "Datascape ID:",
                name: "datascape_id",
    
            },
            {
                label: "Fios ID:",
                name: "fios_id",
    
            },
            {
                label: "A-Check #:",
                name: "acheck_file_number",
    
            },
            {
                "label": "Background Submitted?:",
                "name": "fios_background_check",
                "type": "select",
                "options": [
                    "No",
                    "Yes"
                ]
            },
    
            {
                label: "Created By:",
                name: "created_by",
    
            },
            {
                "label": "Notes:",
                "name": "notes",
                "type": "textarea",
    
            },
            ]
        } );
     
        // Activate an inline edit on click of a table cell
        $('#idRequest').on( 'click', 'tbody td:not(:first-child)', function (e) {
            // Focus on the input in the cell that was clicked when Editor opens
            editor.one( 'open', () => {
                $('input', this).focus();
            });
     
            editor.inline( table.cells(this.parentNode, '*').nodes() );
        } );
     
        var table = $('#idRequest').DataTable( {
            dom: "Bfrtip",
            ajax: "php/table.id.php",
            order: [[ 1, 'asc' ]],
            columns: [
                {
                    data: null,
                    defaultContent: '',
                    className: 'select-checkbox',
                    orderable: false
                },
                {
                    "data": "request_type"
                },
                {
                    "data": "employee_name"
                },
                {
                    "data": "employee_role"
                },
                {
                    "data": "primary_location"
                },
                {
                    "data": "startDate"
                },
    
                {
                    "data": "team"
                },
                {
                    "data": "birthdate_mmdd"
                },
                {
                    "data": "last_4_soc"
                },
    
                {
                    "data": "emp_mobile_number"
                },
                {
                    "data": "email_id"
                },
                {
                    "data": "district_name"
                },
                {
                    "data": "emailGroups"
                },
                {
                    "data": "default_password"
                },
                {
                    "data": "fios_id"
                },
    
                {
                    "data": "native_worker_id"
                },
                {
                    "data": "ssoid"
                },
                {
                    "data": "datascape_id"
                },
                {
                    "data": "fios_background_check"
                },
                {
                    "data": "created_by"
                },
                {
                    "data": "email"
                },
    
                {
                    "data": "complete"
                },
                {
                    "data": "notes"
                },
                {
                    "data": "acheck_file_number"
                },
                {
                    "data": "timestamp"
                },
                {
                    "data": "modified"
                },
                {
                    "data": "updated_by"
                },
            ],
            select: {
                style:    'os',
                selector: 'td:first-child'
            },
            buttons: [
                { extend: "create", editor: editor },
                { extend: "edit",   editor: editor },
                { extend: "remove", editor: editor }
            ]
        } );
    } );

}(jQuery));

Can anyone see any issue with what I have here?

allan

Could you elaborate on what aspect isn't working please? For example, does the browser's console show an error when the page is loaded, when a cell is clicked, when the form is submitted or something else? If you could link to the page that would be really useful so I can debug it.

Allan

davidjmorin

I nixed it so I dont need to go further with this.