Total item does not update after deleting a row!
9 Replies
Hi Toan,
Thanks for using Syncfusion products.
Query#:- I tried to delete several rows and realized that the grid did not update the number of total items!!
We have checked your reported problem by preparing sample but we are unable to reproduce your reported problem at our end. Refer to the sample Link:-
Refer to the screenshot before deletion:-
After deletion:-
We need some more additional details to find the cause of the issue. Share us the following details.
- Complete Grid code example.
- Exact scenario you have faced the issue.
- Screenshot/ Video Demo regarding the issue.
- If possible replicate the issue in the above sample and revert us back.
- Product version details.
Regards,
Farveen sulthana T
Hi,
Thanks for your response.
Please follow my implementation as below:
#In .html file:
#In .js file:
lockerInGroupData = ej.DataManager({
url: "/api/LockerAPI/GetAllLocker/?Level=" + level + "&ControllerIMEI=" + controllerdeviceimei + "&GroupLocker=" + group + "&Page=" + cPageLocker,
adaptor: new ej.WebApiAdaptor(),
offline: true,
});
lockerInGroupData.ready.done(e => {
if (e.result != null) {
$("#DvAllLockerInGroup").ejGrid({
dataSource: ej.DataManager({
json: e.result.locker,
adaptor: new ej.remoteSaveAdaptor(),
crudUrl: "CrudLevelInGroupAction",
}),
allowPaging: true,
pageSettings: { pageSize: 25 },
locale: "vi-VN",
editSettings: {
allowDeleting: true,
showDeleteConfirmDialog: true,
},
columns: [
{ field: "locker.lockerId", visible: false, isPrimaryKey: true, isIdentity: true },
{ field: "locker.createdAt", visible: false },
{ field: "locker.createdBy", visible: false },
{ field: "locker.updatedAt", visible: false },
{ field: "locker.updatedBy", visible: false },
{ field: "controller.level", headerText: "Tầng", width: 60, textAlign: "center", headerTextAlign: "center" },
{ field: "locker.label", headerText: "Nhãn", width: 70, textAlign: "center", headerTextAlign: "center" },
{ field: "locker.position", headerText: "Mô tả vị trí", textAlign: "center", headerTextAlign: "center" },
{ field: "locker.controllerDeviceImei", headerText: "Thiết bị điều khiển", textAlign: "center", headerTextAlign: "center" },
{
commands: [
{ type: "delete", buttonOptions: { text: "" } },
],
headerTextAlign: "center",
textAlign: "center",
width: 50,
}
],
});
}
});
The result of DataManager could be downloaded here: https://drive.google.com/file/d/1fsGhB46q-Atv9hVPx3mBc5BnbkYhZmgv/view?usp=sharing
The attached file for the result also was added
p/s: I captured some images (the different table but they are the same in the implementation)
P1: before delete (total item equal 9)
after the first row has been deleted
Regards,
Toan
Hi,
Please follow full an implementation of a table in my site:
# In the server site:
+ API section
[HttpGet("[action]")]
public IEnumerable<ControllerDevice> GetAllControllerDevice(int Level)
{
return this._context.ControllerDevices.Where(p => Level == 0 ? true : p.Level == Level);
}
+ CRUD action
[HttpPost]
public async Task<IActionResult> CrudControllerAction([FromBody]CRUDViewModel<ControllerDevice> CAction)
{
switch (CAction.action)
{
case "update":
await this.EditControllerDevice(CAction.value);
break;
case "remove":
await this.RemoveControllerDevice(CAction.key);
break;
default:
break;
}
return View(nameof(AddNewControllerDevice));
}
private async Task RemoveControllerDevice(object key)
{
var removingCtrlDevice = this._context.ControllerDevices.Where(p => p.ControllerDeviceId.ToString() == key.ToString()).FirstOrDefault();
if (removingCtrlDevice != null)
{
this._context.ControllerDevices.Remove(removingCtrlDevice);
await this._context.SaveChangesAsync();
}
}
+ Model section:
1)
public class ControllerDevice : AuditInfo
{
[DatabaseGenerated(DatabaseGeneratedOption.Identity), Key]
public int ControllerDeviceId { get; set; }
[StringLength(maximumLength: 128)]
public string IMEI { get; set; }
public int Level { get; set; }
public int? Zone { get; set; }
[StringLength(maximumLength: 256)]
public string Description { get; set; }
}
2)
public class AuditInfo
{
public DateTime? CreatedAt { get; set; }
public DateTime? UpdatedAt { get; set; }
[StringLength(maximumLength: 128)]
public string CreatedBy { get; set; }
[StringLength(maximumLength: 128)]
public string UpdatedBy { get; set; }
}
3)
public class CRUDViewModel<T> where T: class
{
public string action { get; set; }
public object key { get; set; }
public string antiForgery { get; set; }
public T value { get; set; }
public List<T> Added { get; set; }
public List<T> Changed { get; set; }
public List<T> Deleted { get; set; }
}
+ Serialized data:
[{"controllerDeviceId":7,"imei":"869033029500031","level":2,"zone":null,"description":"Cụm tủ 1, phòng ban tài chính quản lý","createdAt":"2019-09-11T15:15:11.1491207","updatedAt":null,"createdBy":"toannm","updatedBy":null},{"controllerDeviceId":8,"imei":"309100073247344","level":2,"zone":null,"description":"Cụm tủ 2, phòng ban tài chính quản lý","createdAt":"2019-09-11T15:15:54.2114776","updatedAt":null,"createdBy":"toannm","updatedBy":null},{"controllerDeviceId":9,"imei":"917093035311098","level":3,"zone":null,"description":"Cụm tủ 5, phòng vật tư quản lý","createdAt":"2019-09-11T15:16:18.2574173","updatedAt":null,"createdBy":"toannm","updatedBy":null},{"controllerDeviceId":10,"imei":"861405127980570","level":3,"zone":null,"description":"Cụm tủ 7, phòng kỹ thuật quản lý","createdAt":"2019-09-11T15:16:35.5731869","updatedAt":null,"createdBy":"toannm","updatedBy":null},{"controllerDeviceId":11,"imei":"66f7476ab8854405","level":3,"zone":null,"description":"Cụm tủ 6, Phòng ban test thiết bị quản lý","createdAt":"2019-09-11T16:34:43.1048309","updatedAt":null,"createdBy":"toannm","updatedBy":null},{"controllerDeviceId":12,"imei":"8c846d11beab7281","level":3,"zone":null,"description":"Cụm tủ 1, phòng ban test","createdAt":"2019-09-11T10:22:05","updatedAt":"2019-09-11T17:24:05.6372802","createdBy":"toannm","updatedBy":"toannm"},{"controllerDeviceId":14,"imei":"359411082849700","level":1,"zone":null,"description":"Cụm Test","createdAt":"2019-09-25T01:09:11.8347213","updatedAt":null,"createdBy":"toannm","updatedBy":null},{"controllerDeviceId":15,"imei":"d8dde00bb75e0a08","level":23,"zone":null,"description":"Tầng 3, Zone 2","createdAt":"2019-09-26T07:42:45","updatedAt":"2019-09-26T14:45:22.7609674","createdBy":"toannm","updatedBy":"toannm"}]# In .html file
<div id="DvTotalLevel">
</div>
# In .js file:
var controllerData = ej.DataManager({
url: "/api/LockerAPI/GetAllControllerDevice",
adaptor: new ej.WebApiAdaptor(),
offline: true,
});
controllerData.ready.done(function (e) {
$("#DvTotalLevel").ejGrid({
dataSource: ej.DataManager({
json: e.result,
adaptor: new ej.remoteSaveAdaptor(),
crudUrl: "CrudControllerAction",
}),
allowPaging: true,
pageSettings: { pageSize: 10, pageSizeList: [10, 15, 20, 25] },
allowResizing: true,
isResponsive: true,
enableResponsiveRow: true,
allowResizeToFit: true,
locale: "vi-VN",
editSettings: {
allowEditing: true,
allowDeleting: true,
showDeleteConfirmDialog: true,
},
columns: [
{ field: "controllerDeviceId", visible: false, isPrimaryKey: true, isIdentity: true },
{ field: "createdAt", visible: false },
{ field: "createdBy", visible: false },
{ field: "updatedAt", visible: false },
{ field: "updatedBy", visible: false },
{ field: "level", headerText: "Tầng", width: 100 },
{ field: "imei", headerText: "Mã định danh" },
{ field: "zone", headerText: "Khu vực" },
{ field: "description", headerText: "Mô tả" },
{
headerText: "Tiện ích",
commands: [
{ type: "delete", buttonOptions: { text: "<i class='far fa-trash-alt'></i>" } },
],
headerTextAlign: "center",
textAlign: "center",
width: 100,
}
]
});
});
# Screenshot before the deletion
After the deletion:
Regards,
Toan
Hi Toan,
As per previous update, we are unable to reproduce your reported problem at our end by using delete button placed as custom button. Refer to the sample Link:-
Refer to the screenshot:-
Also we have created the new Ticket for this query and look into your issue further.
Kindly sign in to your account for further queries.
Regards,
Farveen sulthana T
SIGN IN To post a reply.
