Server side remove

GeorgeHelmke · November 2014

I am trying to remove records with server side processing. I am having trouble getting the data to the controller.

This is MVC, and the controller called looks like this:

public ActionResult Save(string action, string table, string id, SalesLineModel data)

And this is easily reachable by my edits, both inline and programatic. Everything I need comes out in the data argument. I know that MVC does behind the scenes work to make that happen.

Here is how I do it for my edits:

    $('#MainTable').on('click', 'tbody td', function () {
            if (table.data().length !== 0) {
                editor.inline(this);
            }
        });

 editor
              .create(false)
              .set('No_', el.value)
              .set('POrderType', activeRow.POrderType)
              .set('Description', activeRow.Description)
              .set('Quantity', '0')
              .set('LineAmount', '0')
              .set('LineDiscount', '0')
              .set('LineDiscountAmount', '0')
              .set('UnitPrice', '0')
              .set('Document_Type', activeRow.Document_Type)
              .set('DocumentNo_', activeRow.DocumentNo_)
              .set('LineNo_', activeRow.LineNo_)
              .submit();

But when it comes to remove, I am calling the controller, but data is empty.

     $('#MainTable tbody ').on('click', 'button', function (event) {
            var row = $(this).closest("tr").get(0);
            var aData = table.row(row).data();

None of these work:

                editor.remove(row).submit();  //Nothing in data
                editor.remove(this).submit();  //Crash in *
                editor.remove(aData).submit();  //Nothing in data

I know that the submit puts me there, and I could put an extra field in my model that would flag the remove, but I would like to find out what I could do to make it work as designed.

Thanks,
George

*Unhandled exception at line 336, column 46 in http://localhost:49409/Scripts/DataTables-1.10.3/dataTables.editor.js
0x800a138f - JavaScript runtime error: Unable to get property 'id' of undefined or null reference

allan · November 2014

Hi George,

editor.remove(row).submit();

This looks like the correct way to me - it is passing in the row node so Editor can act on that.

As to why there is nothing in the data, I'm not sure and would probably need to see the page. Using the dev tools in your browser, you can inspect the Ajax request make to the server. Does that include the id in the id array?

Allan

GeorgeHelmke · November 2014

I must confess I do not know how to do that. I use the F12 for Internet explorer and inspect css all the time, but never have looked at Ajax requests. Any links would be most appreciated.

allan · November 2014

There are a set of screenshots showing how to see the Ajax request here.

I would suggest using Chrome myself - I've never enjoyed working with the IE dev tools.

Allan

GeorgeHelmke · November 2014

DevTools for Chrome is in the house.

Here is what the row for the edit looks like:

row: {Document_Type:Order, DocumentNo_:800446, LineNo_:10000, POrderType:DIGITALTRYKK, No_:10100,…}

And here is what the row for the delete looks like, and sparse it is indeed:

row: {Document_Type:null, DocumentNo_:null, LineNo_:0, POrderType:null, No_:null,…}

Now what I know asp.net MVC does is try to find everything for the model I hand it. Somehow, it is finding everything post-edit, but not post-delete. Here is what the model looks like:

  public class SalesLineModel
    {
        [Key]
        public string Document_Type { get; set; }  //part of key
        [Key]
        public string DocumentNo_ { get; set; } //part of key
        [Key]
        public int LineNo_ { get; set; } //part of key
        public string POrderType { get; set; }
        public string No_ { get; set; }  //corresponds to item.
        public DateTime ShipmentDate { get; set; }
        public string Description { get; set; }
        public string Description2 { get; set; }
        public string UOM { get; set; }
        public decimal? Quantity { get; set; }
        public double LineAmount { get; set; }
        public string LineDiscount { get; set; }
        public double LineDiscountAmount { get; set; }
        public double UnitPrice { get; set; }
        public string External_Job_Description { get; set; }

        public string ComponentName { get; set; } 
        public int Pages { get; set; }
        public string FormatCode { get; set; }
        public int ColorsFront { get; set; }
        public int ColorsBack { get; set; }
        public string Paper { get; set; }
        public int ConfigurationStatus { get; set; }
        public double CalculatedAmount { get; set; }  
        public string OrderType { get; set; } 
        public string Comments { get; set; } 
        public string ItemDescription { get; set; }  

        public string LineDiscountType { get; set; }
        public string DepartmentCode { get; set; }
        public string Status_Code { get; set; }

allan · November 2014

Super - so that looks like the Ajax response (although it isn't actually valid JSON, which is a little puzzling). What we are specifically interested in at the moment is the data being sent to the server, not what is returned.

In Chrome if you click on the Ajax request and then the "Headers" tab, scroll down a bit and you will see a "Form Data" section. I've put up a screenshot image of one of my examples showing this data here: http://datatables.net/dev/editor-ajax-delete.png .

You will be able to see that id[]: row_64 is being sent to the server. The question is, is something similar being sent in your case?

If it is, is the server-side script correctly handling it?

Regards,
Allan

GeorgeHelmke · November 2014

I went exactly where you told me to go with Chrome. Nice tool BTW.

This is the form data for the successful edit:

action:edit
data[POrderType]:DIGITALTRYKK
data[No_]:10100
data[Description]:Stiftet hefte PLUSS omslag
data[Quantity]:100
data[LineAmount]:6497.35
data[LineDiscount]:0
data[LineDiscountAmount]:0
data[UnitPrice]:649.735
data[External_Job_Description]:10 Brosjyrer, 16 sider i format A4, i 4+4 farger
data[Document_Type]:Order
data[DocumentNo_]:800446
data[LineNo_]:10000
id:

action=edit&data%5BPOrderType%5D=DIGITALTRYKK&data%5BNo_%5D=10100&data%5BDescription%5D=Stiftet+hefte+PLUSS+omslag&data%5BQuantity%5D=1001&data%5BLineAmount%5D=6693.43&data%5BLineDiscount%5D=0&data%5BLineDiscountAmount%5D=0&data%5BUnitPrice%5D=66.9343&data%5BExternal_Job_Description%5D=100+Brosjyrer%2C+16+sider+i+format+A4%2C+i+4%2B4+farger&data%5BDocument_Type%5D=Order&data%5BDocumentNo_%5D=800446&data%5BLineNo_%5D=10000&id=

Here it is for the delete:

action:remove
id[]:

action=remove&id%5B%5D=

allan · November 2014

Okay - excellent!

So the question becomes - why is there no id for that row!

Do you use DT_RowId to specify the id to assign the row, or do you use idSrc to indicate that the id is somewhere else?

Or neither, which might be the problem? :-)

What is the field name of the row id?

Allan

GeorgeHelmke · November 2014

I have done neither.

It is a multi-part key:
[Key]
public string Document_Type { get; set; } //part of key
[Key]
public string DocumentNo_ { get; set; } //part of key
[Key]
public int LineNo_ { get; set; } //part of key

Here are their relevant column defs:

{ mData: "Document_Type", sTitle: "@ResHelper.Loc("Document_Type")", "bVisible": false },
           { mData: "DocumentNo_", sTitle: "@ResHelper.Loc("DocumentNo_")", "bVisible": false },
           { mData: "LineNo_", sTitle: "@ResHelper.Loc("LineNo_")", "bVisible": false },

allan · November 2014

It is a multi-part key

Okay - that is going to make matters a little bit more complex.

What I would suggest, ideally, be done, is to make use of the DT_RowId parameter like in the Editor examples. That parameter is the unique identifier for the row and will be submitted to the server on edit and delete so you know which rows to edit or delete.

If it is a concatenation of other fields you could combine them using a dash or some other character, and then split them apart again to get the multiple parts of your primary key.

The other option is to use the preSubmit event to gather the information from the rows to be edited and send the unique identifying information to the server, but fundamentally, if that information is missing in the request, the server-side doesn't have a chance! :-)

Allan

GeorgeHelmke · November 2014

I just made a field in my model called DT_RowId. That punched through, so I have what I need now. Thanks, we're all good now.

Server side remove

Server side remove

Answers

Howdy, Stranger!

Categories

DataTables

Server side remove

Server side remove

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables