Copy Line Locks Editing with Unable To determine field from source

Copy Line Locks Editing with Unable To determine field from source

Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0

Basically I copy the same line 4 times (chaning the DT_RowID so it is unique) but then when I go to edit a line I get the error:

Unable to automatically determine field "cod" from source. Get this sometimes randomly too. But the className is there and it's there in editor, so I don't know why it is having issues.

//PPA_VPPA TABLE 
var PPA_VPPAeditor = new $.fn.dataTable.Editor( {
    table: currentppavppatableid,
    fields: [ {
            type: 'select', label: 'project', name:  'project', multiple: false, options: projectOptionsList
        }, {
            type:     'select', label:    'Status:', name:     'status', multiple: false, options: proposalStatusOptionsList
        }, {
            label: "Probability:",  name: "probability"
        }, {
            type:     'select', label:    'Contract Type:',  name:     'contracttype',  multiple: false, options: contractTypeOptionsLim
        }, {
            type:     'select',  label:    'Settlement Type:', name:     'settlementtype', multiple: false, options: settlementtypeoptionslist
        }, {
            type:     'select', label:    'Settlement Locations:', name:     'settlementlocation', multiple: false,  options: settlementtypelocationlist
        }, {
            type:     'select',
            label:    'Technology:',
            name:     'technology',
            multiple: false,
            options: technologyppavppastorageLim
        }, {
            type:     'select',
            label:    'Product:',
            name:     'product',
            multiple: false,
            options: productOptionsLim
        }, {
            label: "MW:",
            name: "mw",
            attr: {
                type: "number",
                min: 0
            }
        }, {
            label: "Term Length:",
            name: "termlength"
        }, {
            label: "Escalator:",
            name: "escalator",
            attr: {
                type: "number",
                min: 0
            }
        }, {
            label: "PPA Price ($/MWh):",
            name: "pricemwh",
            attr: {
                type: "number",
                min: 0
            }
        }, {
            label: "At IRR:",
            name: "atirr",
            attr: {
                type: "number",
                min: 0
            }
        }, {
            label: "COD",
            name: "cod",
            type: 'datetime'
        }, {
            type:     'select',
            label:    'Shape:',
            name:     'shape',
            multiple: false,
            options: shapeoptionslist
        }, {
            label: "Pricing Notes:",
            name: "pricingnotes",
            type:  "textarea"
        }, {
            label: "Date Sent:",
            name: "datesent",
            type: "datetime"
        }, {
            label: "Shortlisted:",
            name: "shortlisted",
            type: "checkbox",
            unselectedValue : false,
            options: [
                { label: "", value: true },
            ]
        }, {
            label: "Track:",
            name: "track",
            type: "checkbox",
            unselectedValue : false,
            options: [
                { label: "", value: true },
            ]
        }
    ],
    formOptions: {
        inline: {
            onEsc: 'close'
        }
    }
} );
currentppavppatableid.on('blur', 'td', function () {
    var gettable = jQuery(this).parents('table').DataTable();
    var status = gettable.cell(this).data();
    var getClass = jQuery(this).attr('class');
    var newData = '';
    var options = data.proposalstatuses;
    for (var i = 0; i < options.length; i++) {
        var prob = options[i].prob;
        var value = options[i].value;
        if (status == value) {
            newData = prob;
        }
    } 
    if (getClass.includes("status") == true){
        gettable.cell(jQuery(this).next('td')).data(newData);   
    }
    if (getClass.includes("shortlisted") == true){
        gettable.draw();
    }    
    if (getClass.includes("track") == true){
        gettable.draw();
    }                 
}); 

Answers

  • Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0
    var ppavppatable = currentppavppatableid.DataTable( {
        data: ppavppatabledata,
        searching: false,
        paging: false,
        columns: [
            {
                data: null,
                defaultContent: '',
                className: 'select-checkbox',
                orderable: false
            },
            { data: "project", orderable: true, render: function(data) {
                var select = '';
                for (var i = 0; i < options.length; i ++) {
                    if (options[i].value == data) {
                        select = options[i].label
                    }
                }
                return select
            }, className: 'project'},
            { data: "status", orderable: true, render: function(data) {
                
                var select = '';
                for (var i = 0; i < statusOptions.length; i ++) {
                    if (statusOptions[i].value == data) {
                        select = statusOptions[i].label
                    }
                }
                return select
            }, className: 'status'},
            { data: "probability", orderable: true, className: 'probability', render: $.fn.dataTable.render.number( ',', '.', 0,'', '%' )},
            { data: "contracttype", orderable: true, render: function(data) {
                var select = '';
                for (var i = 0; i < contractOptions.length; i ++) {
                    if (contractOptions[i].value == data) {
                        select = contractOptions[i].label
                    }
                }
                return select
            }, className: 'contracttype'},
            { data: "settlementtype", orderable: true, render: function(data) {
                var select = '';
                for (var i = 0; i < settlementOptions.length; i ++) {
                    if (settlementOptions[i].value == data) {
                        select = settlementOptions[i].label
                    }
                }
                return select
            }, className: 'settlementtype'},
            { data: "settlementlocation", orderable: true, render: function(data) {
                var select = '';
                for (var i = 0; i < settlementlocationoptions.length; i ++) {
                    if (settlementlocationoptions[i].value == data) {
                        select = settlementlocationoptions[i].label
                    }
                }
                return select
            }, className: 'settlementlocation'},
            { data: "technology", orderable: true, render: function(data) {
                var select = '';
                for (var i = 0; i < techOptions.length; i ++) {
                    if (techOptions[i].value == data) {
                        select = techOptions[i].label
                    }
                }
                return select
            }, className: 'technology'},
            { data: "product", orderable: true, render: function(data) {
                var select = '';
                for (var i = 0; i < productOptionsLim.length; i ++) {
                    if (productOptionsLim[i].value == data) {
                        select = productOptionsLim[i].label
                    }
                }
                return select
            }, className: 'product'},
            { data: "mw", orderable: true, className : 'mw' },
            { data: "termlength", orderable: true, className: 'termlength' },
            { data: "escalator", orderable: true, className: 'escalator', render: function(data) {
                var newdata = data.replace('.0%', '');
                return newdata ? newdata + '%' : ''
            }},
            { data: "pricemwh", orderable: true, className: 'pricemwh', render: $.fn.dataTable.render.number( ',', '.', 2, '&#36;' )},
            { data: "atirr", orderable: true, className: 'atirr', render: function(data) {
                var datanew = '';
                if (data) {
                    datanew = data.replace('%', '')
                }
                return datanew ? datanew + '%' : ''
            }},
            { data: "cod", orderable: true, className: 'cod', render: function(data) {
                return data ? moment(data).format('MM/DD/YYYY') : null
            }},
            { data: "shape", orderable: true, render: function(data) {
                var select = '';
                for (var i = 0; i < shapeOptions.length; i ++) {
                    if (shapeOptions[i].value == data) {lect = shapeOptions[i].label}
                }
                return select
            }, className: 'shape'},
            { data: "pricingnotes", orderable: true, className: 'pricingnotes', render: function(data, type, row) {
                var html = data.length > 7 ? data.slice(0, 7) + '...' : data;
                return html
            }},
            { data: "datesent", orderable: true, className: 'datesent', render: function(data) {
                return data ? moment(data).format('MM/DD/YYYY') : null
            }},
            { data: "shortlisted", orderable: true, className: 'shortlisted', render: function(data, type, row) {
                return data == 'false' || data == false ? 'No' : 'Yes'
            }},
            { data: "track", orderable: true, className: 'track', render: function(data, type, row) {
                return data == 'false' || data == false ? 'No' : 'Yes'
            }},
            {
                data: null,
                className: "",
                defaultContent: '<button id="note_editor_copy"><i class="far fa-copy"></i></button> <button id="note_editor_remove"><i class="far fa-trash-alt"></i></button>',
                orderable: false
            },
        ],
        select: {
            style:    'os',
            selector: 'td:first-child'
        },
        keys: {
            columns: ':not(:first-child)',
            keys: [ 9 ],
            editOnFocus: true,
            editor: PPA_VPPAeditor
        },
        order: [[ 19, "desc" ]],
        rowCallback: function( row, data, index ) {
            var filterproject = '';
            jQuery('.ppavppaproject').on('change', function () {
                var selectID = jQuery(this).attr('id');
                if (selectID == ppavppatablefilterid) {
                    var thevalue = jQuery(this).val();
                    var trackvalue = jQuery('.ppavppatrack').val();
                    for (var i = 0; i < options.length; i++) {
                        if (options[i].value == data['project']) {
                            filterproject = options[i].label;
                        }
                    }
                    if (filterproject == thevalue) {
                        jQuery(row).show();
                    } else if (thevalue == 'all') {
                        jQuery(row).show();
                    } else {
                        jQuery(row).hide();
                    }
                }
            });
        }
    });
    
  • allanallan Posts: 61,716Questions: 1Answers: 10,108 Site admin

    Basically I copy the same line 4 times (chaning the DT_RowID so it is unique)

    How are you doing that copy? Are you literly copy / pasting the tr in the browser's inspector? If so, then yes, that won't work because DataTables doesn't "watch" the DOM for transformations. You'd need to add the new rows using rows.add().

    If I've misunderstood, could you clarify for me - hopefully with a link to the page showing the issue so I can help to debug it?

    Thanks,
    Allan

  • Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0

    Allan, here is the code I am using to copy. I have a "Copy" button on each line and it looks for the clicked one and utilizes that rows data to make the new row:

    currentppavppatableid.find('tbody').on( 'click', '#note_editor_copy', function () {
                            var rowData = ppavppatable.row(jQuery(this).parents('tr')).data();
                            jQuery.post(window.location.href, {'postType': 'copyProposalLine', 'data' : JSON.stringify(rowData)}, null, "json")
                                .then(function (data, status, headers, config) {
                                    if (data) {
                                        copyRowCount++;
                                        rowData.DT_RowId = "row_copy" + copyRowCount;
                                        rowData.copiedproposalLineID = jQuery(this).parents('table').data('id');
                                        rowData.proposalLineID = data;
                                        rowData.proposaltypeNewRow = "PPA_VPPA";
                                        rowData.id = rowData.id;
                                        ppavppatable.row.add(rowData).draw();
                                    } else {
                                        jQuery('.main-alerts .alert-error').fadeIn().html('Failed to copy proposal line.');
                                        setTimeout(function(){ 
                                            jQuery('.main-alerts .alert-error').fadeOut() 
                                        }, 4000);
                                    }
                                });            
                        });
    
  • allanallan Posts: 61,716Questions: 1Answers: 10,108 Site admin

    I think I'm going to need a link to a test case showing the issue I'm afraid. It isn't immediately obvious to me why you'd be getting an unknown field error from that.

    Thanks,
    Allan

  • Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0

    Okay, I unfortunately don't have a way to give you access because it is password protected where it lives and I am not able to give you a "seat" to have a login.

  • allanallan Posts: 61,716Questions: 1Answers: 10,108 Site admin

    Is there some way to reliably reproduce the error, or is it fairly random?

    What happens if you remove the editOnFocus: true,? I'm wondering about that because at the moment the field will enter the edit state when clicked on, but it will also trigger your event handler with the jQuery.post.

    Allan

  • Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0

    It doesn't happen all the time, but they noticed it happen when they copied one line 4 times in sucession. I can try removing that

  • allanallan Posts: 61,716Questions: 1Answers: 10,108 Site admin

    4 times quickly? What happens if you wait a few (or even 10) seconds between each copy action? I'm wondering if the Ajax requests are overlapping can causing some issues...

    Allan

  • Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0

    So here is what I figured out. I would copy three times lets say. Then i would edit "Copied Row 3" and adjust the preSubmit function on editor. When I then went to edit a field on "Copied Row 3" the row id was not updating in the preSubmit so it was on row 2 but the preSubmit said row 3. Not sure why that didn't update.

  • Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0

    I fixed it by "rebuilding" the data.data object in the preSubmit. But now I am getting the following error:

    Uncaught TypeError: Cannot read property 'data' of undefined
    
  • allanallan Posts: 61,716Questions: 1Answers: 10,108 Site admin

    Can you show me the latest code please?

    Allan

  • Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0

    The biggest change was the for (key ... part I did at the beginning of the presubmit

    //SUBMIT ONLY ONE CELL
                        var ppavppafieldtoedit = '';
                        var ppavppanoterowtoedit = '';
                        var ppavppaproplineid = '';
                        var ppavppapropid = '';
                        var ppavppaopportunity = '';
                        var ppavppanoterowtoeditvalue = '';
                        PPA_VPPAeditor.on('initEdit', function (e, node, data, items) {
                            ppavppanoterowtoedit = '';
                            ppavppafieldtoedit = jQuery(ppavppatable.cell(items).node()).attr('class').split(' ')[0];
                            ppavppanoterowtoedit = jQuery(ppavppatable.row(items.row).node()).attr('id');
                            ppavppaproplineid = data.proposalLineID;
                            ppavppapropid = data.id;
                            ppavppaopportunity = jQuery(ppavppatable.cell(items).node()).parents('table').data('id');
                            ppavppanoterowtoeditvalue = data;
                        });
                        
    
                        PPA_VPPAeditor.on('preSubmit', function (e, data, action) {
                            
                            var newtest = data.data;
                            var test = '';
                            for (var key in newtest) {
                                test = data.data[key]
                            }
                            data.data = {[ppavppanoterowtoedit] : test};
    
                            if (data.data[ppavppanoterowtoedit][ppavppafieldtoedit] == undefined) {
                            } else if (ppavppafieldtoedit == 'escalator' && !data.data[ppavppanoterowtoedit][ppavppafieldtoedit]) {
                                data.data[ppavppanoterowtoedit][ppavppafieldtoedit] = '0'
                            } else if (ppavppafieldtoedit == 'escalator' && data.data[ppavppanoterowtoedit][ppavppafieldtoedit] > 100 || data.data[ppavppanoterowtoedit][ppavppafieldtoedit] < 0) {
                                alert('The value for this field must be between 0-100');
                                data.data[ppavppanoterowtoedit] = {};                
                                data.data[ppavppanoterowtoedit][ppavppafieldtoedit] = ppavppanoterowtoeditvalue.escalator;
                            } else if (ppavppafieldtoedit == 'atirr' && data.data[ppavppanoterowtoedit][ppavppafieldtoedit] > 100 || data.data[ppavppanoterowtoedit][ppavppafieldtoedit] < 0) {
                                alert('The value for this field must be between 0-100');
                                data.data[ppavppanoterowtoedit] = {};                
                                data.data[ppavppanoterowtoedit][ppavppafieldtoedit] = ppavppanoterowtoeditvalue.atirr;
                            } else if (ppavppafieldtoedit == 'probability' && data.data[ppavppanoterowtoedit][ppavppafieldtoedit] > 100 || data.data[ppavppanoterowtoedit][ppavppafieldtoedit] < 0) {
                                alert('The value for this field must be between 0-100');
                                data.data[ppavppanoterowtoedit] = {};                
                                data.data[ppavppanoterowtoedit][ppavppafieldtoedit] = ppavppanoterowtoeditvalue.probability;
                            } else {
                                var thevalue = '';
                                jQuery.each( data.data, function ( key, values ) {
                                    thevalue = values[ppavppafieldtoedit]
                                });
                                data.data[ppavppanoterowtoedit] = {};                
                                data.data[ppavppanoterowtoedit][ppavppafieldtoedit] = thevalue;
    
                                var newData = '';
                                for (var i = 0; i < proposalstatusoptionsprob.length; i++) {
                                    var prob = proposalstatusoptionsprob[i].prob;
                                    var value = proposalstatusoptionsprob[i].value;
                                    if (data.data[ppavppanoterowtoedit][ppavppafieldtoedit] == value) {
                                        newData = prob;
                                    }
                                }
    
                                if (thevalue === 00) {
                                    jQuery.post(window.location.href, {'postType': 'updateProposalLineItemFields', 'proplineid' : ppavppaproplineid, 'value' : '', 'field' : ppavppafieldtoedit}, null, "json")
                                    .then(function (thedata, status, headers, config) {
                                        if (thedata) {
                                            
                                        } else if (thedata == 'Record has been changed') {
                                            alert('Line field not updated: Please slow down while your change is being processed')
                                        } else {
                                            alert('Line field not updated')
                                        }
                                    });
                                } else {
                                    if (ppavppafieldtoedit == 'status') {
                                        jQuery.post(window.location.href, {'postType': 'updateProposalLineItemFields', 'proplineid' : ppavppaproplineid, 'value' : thevalue, 'field' : ppavppafieldtoedit}, null, "json")
                                        .then(function (thedata, status, headers, config) {
                                            if (thedata) {
                                                jQuery.post(window.location.href, {'postType': 'updateProposalLineItemFields', 'proplineid' : ppavppaproplineid, 'value' : newData, 'field' : 'probability'}, null, "json")
                                                    .then(function (thedata, status, headers, config) {
                                                        if (thedata) {
                                                            
                                                        } else {
                                                            alert('Line field not updated')
                                                        }
                                                    });
                                            } else if (thedata == 'Record has been changed') {
                                                alert('Line field not updated: Please slow down while your change is being processed')
                                            } else {
                                                alert('Line field not updated')
                                            }
                                        });
                                    } else {
                                        jQuery.post(window.location.href, {'postType': 'updateProposalLineItemFields', 'proplineid' : ppavppaproplineid, 'value' : jQuery.isArray(thevalue) == true ? thevalue[0] : thevalue, 'field' : ppavppafieldtoedit, 'propid' : ppavppapropid, 'oppoid' : ppavppaopportunity}, null, "json")
                                            .then(function (thedata, status, headers, config) {
                                                if (thedata) {
                                                    
                                                } else if (thedata == 'Record has been changed') {
                                                    alert('Line field not updated: Please slow down while your change is being processed')
                                                } else {
                                                    alert('Line field not updated')
                                                }
                                            });
                                    }
                                }
                            }});
    
  • allanallan Posts: 61,716Questions: 1Answers: 10,108 Site admin

    Thank you.

    Uncaught TypeError: Cannot read property 'data' of undefined

    Where does the the console show this error happening - i.e. what line of code. Is it in the block above, or somewhere else?

    Allan

  • Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0

    Yes, i believe right around line 45 of the code block there.

  • allanallan Posts: 61,716Questions: 1Answers: 10,108 Site admin

    jQuery.each( data.data, function ( key, values ) {

    Where data.data is:

    data.data = {[ppavppanoterowtoedit] : test};

    And ppavppanoterowtoedit is:

    jQuery(ppavppatable.row(items.row).node()).attr('id');

    The first thing to do is check that ppavppanoterowtoedit is a valid valid. Then inspect what data.data actually. Perhaps you can do: console.log(JSON.stringify(data)) (just before that jQuery.each call) and show me the result of that.

    Allan

  • Nwilliams8162Nwilliams8162 Posts: 28Questions: 4Answers: 0

    I added console.log before the each and this is what was returned on the first field I edited:

    {"data":{"row_copy4":{"termlength":"1212","escalator":"","shortlisted":[false],"track":[false]}},"action":"edit"}
    

    Then, I tried editing another field and got this:
    Uncaught TypeError: Cannot read property 'termlength' of undefined

  • allanallan Posts: 61,716Questions: 1Answers: 10,108 Site admin

    On this line: thevalue = values[ppavppafieldtoedit]?

    What is the value of ppavppafieldtoedit?

    Can you give me a link to a page showing the issue please?

    Thanks,
    Allan

This discussion has been closed.