New value in inline editor not updating when hitting enter

New value in inline editor not updating when hitting enter

villarroel88villarroel88 Posts: 7Questions: 1Answers: 0

I have the inline editor extension, and when i edit a field and press enter, the ajax works, it saves the data, but visually the input goes back to what i had before, it doesnt update to the value i entered.

any ideas why this might happpen? thanks!

Answers

  • kthorngrenkthorngren Posts: 21,243Questions: 26Answers: 4,929

    I would start by verifying the serve is returning the expected data when editing. This page describes the requirements:
    https://editor.datatables.net/manual/server#Server-to-client

    Kevin

  • villarroel88villarroel88 Posts: 7Questions: 1Answers: 0
    edited July 2018

    This is my route to edit one field:

    console.log('ape1', data[recordID].ape1, recordID)
    //update ape1

                        const pool1 = new sql.ConnectionPool(config, err => {
                            if (err) {
                                console.log(err)
                            } else {
                                pool1.request()
                                    .query(`EXEC zsp_actcamporeg ${recordID}, 'ape1', '${data[recordID].ape1}'`, (err, results) => {
                                        if (err) {
                                            console.log(err)
                                        } else {
                                        }
                                    })
                            }
                        })
                    }
    

    the console.log at the beggening returns something like

    ape1 ACOSTA 2587818

    ape1 is the name of the field, ACOSTA is the new content i entered and the number is the record id. but somehow when i type ACOSTA and hit enter, visually it goes back to what it was before.. not the new entered text

  • kthorngrenkthorngren Posts: 21,243Questions: 26Answers: 4,929

    Are you returning the data for all the columns or just the edited column?

    Kevin

  • villarroel88villarroel88 Posts: 7Questions: 1Answers: 0

    req.body.data returns

    { '2587829': { ape1: 'MARTINEZ' } }

    field id, field name and field new content

  • villarroel88villarroel88 Posts: 7Questions: 1Answers: 0

    my script is the following

        var editor;
        $(document).ready(function () {
        editor = new $.fn.dataTable.Editor( {
        ajax: "/updateanddelete",
        table: "#bootstrap-data-table",
        fields: [ {
        label: "Ord:",
        name: "ord"
        }, {
        label: "Ape 1:",
        name: "ape1"
        }, {
        label: "Ape 2:",
        name: "ape2"
        }, {
        label: "Nombre:",
        name: "nombre"
        }
        ]
        } );
        $('#bootstrap-data-table').on( 'click', 'tbody td:not(:first-child)', function (e) {
        editor.inline( this, {
          onBlur: 'submit'
        } );
        } );
        editor.field( 'ord' ).disable();
        $('#bootstrap-data-table').DataTable({
        dom: "Bfrtip",
        "language": {
        "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Spanish.json"
        },
        rowReorder: {
        dataSrc: 'ord',
        editor:  editor
        },
        "iDisplayLength": 800,
        select: true,
        columns: [ {
    
        data: "ord"
        }, {
    
        data: "ape1"
        }, {
    
        data: "ape2"
        }, {
    
        data: "nombre"
        }
        ],
        buttons: [
        // { extend: "create", editor: editor },
        { extend: "remove", editor: editor },
        'print'
        ]
        });
        });
    
  • kthorngrenkthorngren Posts: 21,243Questions: 26Answers: 4,929

    Its still not clear if you are returning the full row of data as described in the doc I linked to. My guess is the format of your data is not consistent with the format of the original data. Can you post your Datatables init code?

    And post a snippet of the original data returned.

    Kevin

  • villarroel88villarroel88 Posts: 7Questions: 1Answers: 0

    .query(EXEC zsp_actcamporeg ${recordID}, 'ape1', '${data[recordID].ape1}', (err, results) => {
    if (err) {
    console.log(err)
    } else {
    console.log(results)
    }
    })

    results return

    { recordsets: [],
    recordset: undefined,
    output: {},
    rowsAffected: [ 1 ] }

  • kthorngrenkthorngren Posts: 21,243Questions: 26Answers: 4,929

    It still seems you are not returning the data in the expected format. You can use the diagnostic steps in this technote to see what exactly is returned in the ajax response. You can compare the request/response to the link I provided above.

    Even with inline editing you need to return the data for all the columns of the row you are editing.

    Kevin

  • villarroel88villarroel88 Posts: 7Questions: 1Answers: 0

    i modified the stored procedured that im working with to update the field and now im returning this

    { recordsets: [ [ [Object] ] ],
    recordset:
    [ { recid: 2587830,
    ordcuad: 1,
    ape1: 'MARTINEZasdf',
    ape2: 'RAMIREZ',
    nom: 'ABEL ALEJANDRO',
    casilla: '9999C1' } ],
    output: {},
    rowsAffected: [ 1, 1 ] }

    do i have to modify it to match this format?

    {
    "data": [
    {
    "DT_RowId": "row_29",
    "first_name": "Fiona",
    "last_name": "Green",
    "position": "Chief Operating Officer (COO)",
    "office": "San Francisco",
    "extn": "2947",
    "salary": "850000",
    "start_date": "2010-03-11"
    }
    ]
    }

    sorry for basic questions, its the first time i use datatables editor.

  • kthorngrenkthorngren Posts: 21,243Questions: 26Answers: 4,929

    sorry for basic questions, its the first time i use datatables editor.

    Not a problem. We all were first time users once :smile:

    do i have to modify it to match this format?

    As far as I know there is no option to change where the Datatable's Editor expects the data. You can either change the object from recordset to data in your stored procedure or you can try the success function, as described in the Editor ajax option to return the data in the data object.

    Kevin

  • villarroel88villarroel88 Posts: 7Questions: 1Answers: 0

    Is there any way i can hire someone to do this for me from this forum? lol

This discussion has been closed.