Table Is Not Updating After Submit

larsonch

I've been banging my head against a wall for a long time on this, and I'm sure it's something very simple. I'm using python/Flask on the server side. The request and response seem to be working, but once I click "submit" the row in the table is not updated. If I refresh the page the data is updated (i.e. the database is getting updated with the new data).

So for example if I have a line item that has the following data.

{"data": {"id":2, "lineitem": "Loss on disposition of assets", "section": "oancf", "mapping": "test", "value": "5.000", "negative": false}}

Then I for example edit the "value" to 10.

The response I send back from the server looks like this:

{"data": {"lineitem": "Loss on disposition of assets", "section": "oancf", "mapping": "test", "value": "10.000", "negative": false, "id": 2}}

Here's the script:

var editor;
      $(function(){
            var editor = new $.fn.dataTable.Editor( {
              table: '#lineitemtable',
              ajax: {
                create: {type:'POST', url:'/newLineItem'},
                edit: {type:'POST', url:'/updateLineItem/'+{{cik}}+'/'+{{datadate}}, data: function (args) {
                  return {"args": JSON.stringify(args)};}, dataType: 'json'
                },
                remove: {type:'DELETE', url:'/deleteLineItem'}
              },
              idSrc: 'id',
              fields: [  
                {label: "ID",
                name: "id"
                },{
                label: "Section:",
                name: "section"
                },{
                label: "Line Item",
                name: "lineitem"
                },{
                label: "Neg.",
                name: "negative"
                },{
                label: "Value",
                name: "value"
                },{
                label: "Mapping",
                name: "mapping"
                }]
          });

        $.ajax({
          url : '/getLineItems/'+{{cik}}+'/'+{{datadate}},
          type : 'GET',
          dataType: 'json',

          success: function(lines){
            var table=$('#lineitemtable').DataTable(
            {
              data: lines,
              paging: false,
              dom: 'Bfrtip',
              columns:[
                  {"data": "id"},
                  {"data": "section"},
                  {"data": "lineitem"},
                  {"data": "negative"},
                  {"data": "value"},
                  {"data": "mapping"}
                ],
              "columnDefs": [
                    // Column index begins at 0
                    {"className": "align-left", "targets":[0,1,2,3,4,5]},
                ],                    
                select: true,
              buttons: [
                { extend: 'create', editor: editor },
                {extend: 'edit', editor: editor },
                { extend: 'remove', editor: editor }
                ]
              });
            },
          error: function(error){
            console.log(error);
            }
          });
});