Editor remove and rowReorder without ajax

ECEGROUPE

Hi,

As i can't submit a test case with editor, i will try to explain you my problem, but first i know there is some exemple like there (https://editor.datatables.net/examples/extensions/rowReorder) but it's done with ajax and i try to do it without ajax as you can see bellow.

I have set up a table with Datatable editor and RowReorder like this :

// start: Editor
var editor = new DataTable.Editor({
    idSrc: "Ordre",
    fields: [
        {
            "label": "Article",
            "name": "Article"
        },
        {
            "label": "Désignation",
            "name": "Désignation"
        },
        {
            "label": "Quantité",
            "name": "Quantité"
        },
        {
            "label": "Montant",
            "name": "Montant"
        }
    ],
    table: "#TableCreateDevis"
});
// end: Editor

var data = [
    {
      "Ordre": 1,
      "Article": "Article",
      "Désignation": 'velo',
      "Quantité": 1,
      "Montant": '1000'
    },
    {
        "Ordre": 2,
        "Article": "Article",
        "Désignation": 'voiture',
        "Quantité": 1,
        "Montant": '3000'
    },
    {
        "Ordre": 3,
        "Article": "Article",
        "Désignation": 'camion',
        "Quantité": 1,
        "Montant": '6000'
    },
    {
        "Ordre": 4,
        "Article": "Débours",
        "Désignation": 'avion',
        "Quantité": 1,
        "Montant": '15000'
    },
];

// start: Datatable
var table = new DataTable("#TableCreateDevis", {

    data:data,

    language: {
        url: staticUrl,
        emptyTable: 'Devis vide'

    },

    buttons: [
        {
            extend: 'remove',
            className: "w-100 h-100 p-3",
            editor: editor,
            formMessage: function (e, dt) {
                var rows = dt
                    .rows(e.modifier())
                    .data()
                    .pluck('Désignation');
                return (
                    'Êtes-vous sûr de vouloir supprimer la ligne "'+rows.join() +'"'
                );
            }
        }   
    ],

    columns: [

            { data: "Ordre", name:"Ordre", className: 'reorder', width: '10%'

            },
            { data: "Article", name:"Article", visible: false,
                render: function (data, type){
                    if (data == null) {
                        return "";
                    }
                return data;    
                },
            },
            { data: "Désignation", name:"Désignation", className: 'editable', width: '60%',
                render: function (data, type){
                    if (data == null) {
                        return "";
                    }
                return data;    
                },
            },
            { data: "Quantité", name:"Quantité", className: 'editable', width: '10%',
                Render: function (data, type){
                    if (data == null) {
                        return "";
                    }
                return data;    
                },
            },
            { data: "Montant", name:"Montant", className: 'editable', 
                Render: function (data, type){
                    if (data == null) {
                        return "";
                    }
                return data;    
                },
            },

    ],

    columnDefs:[{
        className: "dt-center", targets: "_all",
    },],

    dom: "Brtp",
    select: true,
    processing: true,
    deferRender: true,
    scrollX: true,
    pageResize: true,

    rowReorder: {
        dataSrc: 'Ordre'
    },

});
// end: Datatable

Everything work fine, i can change the order of my column when i drag and drop with the first column (the Row Order update correctly) but when i delete a Row, the Row Order doesn't update ( for exemple, i delete the row 2, the number 3 and 4 doesn't update to 2 and 3).

Can you help me pls ? Thank for you time / answer !