couple of problems with rowReorder

crush123

I am using this editor plugin for a few reference tables, but have noticed some strange behaviour.

If i try and delete multiple rows, the order number creates duplicates, (it also does this on the example page)

https://editor.datatables.net/examples/extensions/rowReorder.html

secondly, my insert behaviour uses a hidden field which automatically assigns a value to my field, but I just noticed that it always inserts at #10 if there are 10 or more rows.

here is a snippet from the editor code...

fields: [ {
            label: "Order:",
            name: "refeventtype.ListOrder",
            type: "hidden",
            def: function () {
              var nextSeqNum = table
                  .column(0)
                  .data()
                  .sort()
                  .reverse()[0];
                  //console.log(nextSeqNum);
                if (nextSeqNum == null) {
                    return 1;
                } else {
                    return parseInt(nextSeqNum) + 1;
                }
            }
        }, {
           ...
        }
    ]

if i output nextSeqNum to the console, it is always 9, (when there are 9 or more rows). It looks like nextSeqNum variable is being treated as text

allan

Thanks for pointing out the multiple delete issue. I'm afraid I don't have an immediate solution for that. I've logged a bug and will look into it as soon as possible.

The nextSeqNum issue makes it sounds like you are using server-side processing (i.e. only a limited subset of the data is available on the client-side). Is that the case? If so, you might need to make an Ajax call to the server to find out what the next sequence number should be, or perhaps use page.info() to get information about the number of rows in the table.

Allan

crush123

I believe all of the data is getting to the client side, (there is no filter in my json source)

i set up a test page

http://test3.forthwebsolutions.com/vanilla_eventtypes.php

if there are up to 9 entries in the table, the insert is fine.
if a tenth is added, at the point of insert the nextSeqNum = 9 and the new ListOrder value is set to 10
if an eleventh is added, nextSeqNum is still 9 (and the new ListOrder value is set to 10 and so on)

re the multiple delete, is there a way to prevent multi row delete so only one row can be removed at a time ?

allan

Thanks for the link. The issue is that your numeric data points are all strings. We can see this on the console:

table
                      .column(0)
                      .data()
                      .sort()
                      .reverse()
= ["9", "8", "7", "6", "5", "4", "3", "2", "10", "1"]

You need to use a sorting function to convert them to be numbers rather than string. sort() is just like the Javascript sort() method (in fact it is the Array.prototype.sort method) so you can pass in a function to do the sort as needed (i.e. just parse them as integers). MDN has lots of information about sorting arrays with custom functions.

Allan

crush123

Thanks Allan, - and thanks for the link

If anyone else has this issue, here is my solution...

fields: [ {
            label: "Order:",
            name: "refeventtype.ListOrder",
            type: "hidden",
            def: function () {
              var nextSeqNum = table
                  .column(0)
                  .data()
                  .sort(function(a, b) {
                      return a - b;
                    })
                  .reverse()[0];
                  console.log(nextSeqNum);
                if (nextSeqNum == null) {
                    return 1;
                } else {
                    return parseInt(nextSeqNum) + 1;
                }
            }
        }, {
            ...
        }
    ]

crush123

As a quick fix for the multi delete problem, I replaced the default editor remove button as follows, seems to work ok.

{
            extend: "selectedSingle",
            text: 'Delete',
            action: function ( e, dt, node, conf ) {
            var selectedRow = dt.row( { selected: true } );
            editor
            .title( 'Delete entry' )
            .buttons( 'Delete' )
            .message( 'Are you sure you want to delete this item ?' )
            .remove( selectedRow.index() );
            }
        }