'Updating database after reordering Datatable

I'm struggling with the datatables reordering. I want when user reorder to update table in the database. For this to happen i need:

  1. to configure the datatable to send request to the server.
  2. send the information about reordered datatable to flask endpoint.
  3. Process data on the backend and update database table.

I have read the documentation but it is not clear to me.

My code:

  $(document).ready(function () {
    var dt = $('#data').DataTable({
    rowReorder: true,
    dom: 'Bfrtip'
    });       
});



Solution 1:[1]

My own solution:

JavaScript code:

dt.on('row-reorder.dt', function (e, details, edit) {

      var  slownik  = {};
      for (var i = 0, ien = details.length; i < ien; i++) {
        
        let id_asortymentu = details[i].node.id;
        let nowa_pozycja = details[i].newPosition+1;
        console.log(id_asortymentu);
        console.log(nowa_pozycja);
        slownik[id_asortymentu] = nowa_pozycja;
      }
      req = $.ajax({
        url: 'asortymenty/tabela_reorder',
        dataType: "json",
        type: 'POST',
        data : JSON.stringify(slownik)
      });

      req.done(function(data){
          if (data.result == 1){
          console.log('Table reordered.');
        }
      });
    });

Flask backend code:

@admin.route('asortymenty/tabela_reorder', methods = ['GET','POST'])
def table_reorder():
    slownik=request.get_json('data')
    for key, value in slownik.items():
        asort = Asortyment.query.get(key)
        print(asort.pozycja)
        asort.pozycja = value
        db.session.add(asort)
    db.session.commit()
    return jsonify({'result' : '1'})

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1