Inline Editing Randomly Stops Working

essicumd

So this is pretty much the last issue I'm trying to work out with our system. For some reason, after making multiple edits using the inline functionality of the Editor along with submitOnBlur the inline editor just ceases to function. You can't click on anything. The ONLY fix for this as far as I can see is a complete page refresh. There's no error messages coming up in the debug console. No error messages on the server either. I am NOT using ServerSideProcessing in this setup.

Because this is such a weird issue with no leads whatsoever, I don't really know what code to submit into this question. I'm not sure if this is a bug or something I'm doing. I do have a support account setup to be able to access our DataTables system with fake data in the table. Where could I email the login information for our site for someone to take a look at it?

essicumd

I'm using the latest version of Editor and DataTables, and am using the updated inline statement referencing the index() instead of just 'this'. It doesn't seem to matter what type of field is changed and it really does seem to be pretty random after how many edits it will cease to function. I did manage one time to get another cell to open for edit by just continuing to click around the DataTable but it definitely has no rhyme or reason as to when or if it'll come back.

essicumd

So, I'm going to go ahead and paste some code here to see if anyone can immediately see anything that sticks out. Thanks!

    /* DataTable Editor Event Functions */
    editor
    .on( 'initCreate', function() {
        editor.enable('tag');
    })
    /* Update the list of IP addresses */
    .on( 'initEdit', function () {
        var rowData = table.row(editor.modifier()).data();
        var temp = null;
        if(rowData) {
            if(rowData.tag)
                editor.disable('tag');
            if(rowData.leased_out) {
                editor.field('leasebox').val(1);
                editor.field('leased_out').enable();
            }
            temp = JSON.parse(JSON.stringify(availIPs));
            if(rowData.ip_id > 0) {
                var obj = {};
                        var curIP = document.createElement("option");
                        curIP.text = lookupip[rowData.ip_id];
                        curIP.value = rowData.ip_id;
                        if(rowData.is_router == 1) {
                                curIP.text = curIP.text.concat(" (R)");
                        }
                obj.label= curIP.text;
                obj.value= curIP.value;
                temp.unshift(obj);
            }
            temp.unshift({label:'N/A',value:'0'});
            editor.field('ip_id').update(temp);
            if(rowData.ip_id !== null)
                editor.field('ip_id').set(rowData.ip_id);
            else
                editor.field('ip_id').set(0);
        }
        else {
            temp = JSON.parse(JSON.stringify(availIPs));
            temp.unshift({label:'N/A',value:'0'});
            editor.field('ip_id').update(temp);
        }
        openVals = JSON.stringify(editor.get());
    })

    /* Update list of available IP addresses from the server's response. */
    .on('submitSuccess', function(e,json,data) {
        if(json) {
            availIPs = json.available_ips;
        }
    })
    
    /* Determine what in the record has changed and record the change in the history. If no change, then cancel edit. */
    .on('preSubmit', function(e,data,action) {
                if(action == 'create')
                        data.data.description = "Asset Created";
                else if(action == 'edit') {
            if(openVals !== JSON.stringify(editor.get())) {
                /* Construct the history tracking message here. */
                data.data.description = "Asset Edited: ";

                data.data.description += diffString;
            }
            else {
                editor.close();
                return false;
            }
        }
    });

    /* Turn on submit on blur of any field within the DataTable that can be edited */
    jQuery('#cStoreDataTable').on('click', 'tbody td:not(:first-child)', function(e) {
        editor.inline(table.cell( this ).index(), {
                submitOnBlur: true
        });
    });

allan

Are you able to give me a link to the page that shows this issue so I can try to figure out what is causing it please? Nothing immediately stands out from the above code.

Thanks,
Allan

essicumd

Allan,

I've sent you a private message with the details as requested. Thanks so much!

essicumd

Just posting the solution that was provided by Allan to this issue so I can mark it as answered and help out anyone else who may have had this issue.

I was trying to cancel the edit when data hadn't been changed by forcing preSubmit to do an editor.close() and return false. This was causing the Editor's inline onBlur event to malfunction a bit. I have been informed that Editor 1.5 will allow for only submitting changed data to the server thus saving the server from unnecessary POSTs from the client. For now, I simply removed the code and everything functions as it should when utilizing the inlineEditor functionality of Editor. Thanks again, Allan!