RowReorder ajax request error

n8price

Hello,
I am trying to implement the RowReorder Drag and sort feature to my table. The Drag and sort feature works fine on the view, but when it's closed and reopened, it's reverted back. It not getting saved. It's not making any ajax calls for the changes to be made permanent.
Here's the code snippet for the datatable:

    var loadTable = /../....
    var bmFormulaTable = $('#bmFormula').DataTable( {
            //rowId: 'id',
            ajax: loadTable,
            rowReorder: {
               dataSrc: 'sequence',
               editor:  editor
            },
            columns: [
                           { data: "sequence", width: "10%", className: 'reorder' },
                           { data: "name.en", width: "10%"  }
    ],
            select: true,
            buttons: []
} );

//This is the snippet for the editor:

var editTable = /../....
editor = new $.fn.dataTable.Editor( {
    table: "#bmFormula",
    idSrc: "id",
    ajax:editTable,
    fields: [ {
        label: "Sequence:",
        name: "sequence",
        type: "select",
        optionsPair: {
            label: 'name',
            value: 'value'
        }
    }
    ]
} );

The columns in the database are (sequence, id, name). 'id' is the primary key, sequence is the order in which the table should sort.
Found out that DT uses DT_RowId as the default id and so included rowId: 'id'. This starts to make the rows disappear after they are dragged. In the database all the rows of the 'sequence' column tend to become all 3s or all 2s and so on.
I've been at it for quite sometime now. Can anyone please help me out with this? I'd surely appreciate any sort of help. Thanks

allan

Hi,

Thanks for your question. Could you show me the JSON data that is being loaded by the DataTable when it loads the page (i.e. not after a drag and drop)?

Also, what is editTable - is that a string?

Thanks,
Allan

n8price

Hey @allan ,
Thank you so much for the reply and sorry about the delayed response.

editTable contains the URL for the ajax call.
var editTable = appCon+"/scMod/upBen?scModId="+$("#scModId").val();

Just FYI, Could not figure out the drag and drop, hence temporarily using the select field type to organise sequence.

This is the JSON structure that gets loaded:

  - object
     - data
        - 0
           - class : com.tp.bui.ent.sg
           - id : 3000
           - name
               en: abc
               sequence : 1
             - type
                  enumType: com.tp.comm.enu.sg.Type
                  name: XYZ 
        + 1
        + 2
     - options
        - 0
            class : com.tp.util.NVB
            name : 1
            value : 1
        + 1
        + 2

tangerine

The actual JSON would be more useful.

n8price

Thanks for the response @tangerine . You can find the JSON object in this link:
https://jsonblob.com/4973a52c-7213-11e7-9e0d-75b2bba00e3b

Thanks...

n8price

Hey @allan , @tangerine , is the provided data sufficient or is anything else necessary. Please let me know.

Thanks...

allan

Sorry for my own delay in replying - it dropped on the first few pages and I missed it!

Could you try removing type: "select", from your field definition please? Let it be plain text so the sequence number can be applied without needing to supply all possible options that it could be.

Thanks,
Allan

n8price

@allan , Thank you for the response. I tried that but it made no difference.

allan

Any chance of a link to the page showing the issue so I can check it out? You can send me a PM by clicking my name above and then "Send message".

Regards,
Allan