Delete row using build-in toolbar. But remove wrong row in datasource

[Steve Lei]

Hi,

When I trying to delete row in grid using build-in toolbar, the deletion display is correct. However, when I try get the datasource in jQuery, it seems remove wrong row in datasource.

For example, the product grid shows 2 products. If I delete 1st item, the display and datasource are sync. correctly. But if I delete 2nd item. The display is correct, but datasource is showing 1st itme data.

Here is how I get the datasource object in jQuery

var products = $("#InvoiceProducts").ejGrid("option", "dataSource");

I am using this is because I have save button for entire form. The controller will get all updated data and determine which row need to insert/update or delete.

Does additional call to make grid sync with datasource after deletion?

Attached is the screenshot document to explain more clearly.

Thanks.

Attachment: Syncfusion_Grid_Deletion_f49c6ded.zip

[Steve Lei]

I think I may find out why delete the wrong one. I have to set the primarykey field to true.

@(Html.EJ().Grid<InvoiceProductServices>("InvoiceProducts").Datasource((IEnumerable<object>) Model.InvoiceProducts)

                                  .AllowPaging()

                                  .AllowTextWrap()

                                  .TextWrapSettings(wrap => { wrap.WrapMode(WrapMode.Both); })

                                  .EditSettings(edit => { edit.AllowDeleting().AllowEditing().ShowDeleteConfirmDialog(); })

                                  .ToolbarSettings(toolbar =>

                                  {

                                      toolbar.ShowToolbar().ToolbarItems(items =>

                                      {

                                          items.AddTool(ToolBarItems.Edit);

                                          items.AddTool(ToolBarItems.Delete);

                                      });

                                  })

                                  .Columns(col =>

                                  {

                                      col.Field("Id").Visible(false).IsPrimaryKey(true).Add();

                                      col.Field("ModelNumber").HeaderText("Model Number").Width(130).Add();

                                      col.Field("Description").HeaderText("Description").Add();

                                      col.Field("Amount").HeaderText("Amount").TextAlign(TextAlign.Right).Type(ColumnType.Number).Format("{0:C}").Width(75).Add();

                                      col.Field("Quantity").HeaderText("Quantity").TextAlign(TextAlign.Center).Width(75).Add();

                                      col.Field("Total").HeaderText("Total").TextAlign(TextAlign.Right).Type(ColumnType.Number).Format("{0:C}").Width(75).Add();

                                  })

                                  )

[Mani Sankar Durai]

Hi Steve,  

Thanks for contacting Syncfusion support. 

Yes the primary key for the data source should be defined in Columns definition, for editing to work properly by enabling IsPrimaryKey property of columns in grid. We have already discussed about this in the following KB.  

https://www.syncfusion.com/kb/2675/cant-edit-any-row-except-the-first-row-in-grid  

Refer to the Help Documents and API Reference Section of the Grid.  

https://help.syncfusion.com/js/api/ejgrid#members:columns-isprimarykey  

Also we have already documented about the necessity of IsPrimaryKey property of columns in the Editing section of the below document link.  

 Link: https://help.syncfusion.com/aspnetmvc/grid/editing  

 

Please let us know if you need further assistance. 

 

Regards,  

Manisankar Durai