Data Manager UrlAdaptor doesn't trigger on Delete and Update

[Jessica Goodrich]

Hello, 

I have a grid that has rowDataBound adding background colors to my rows. When I add a new row, the data manager url is hit again and rowDataBound is triggered and everything comes out nicely. But when I edit a row or delete a row, the data manager url is not hit and rowDataBound is not triggered and my rows no longer have the proper background colors. How can I trigger the data to be retrieved again from the url on Deletes and Updates?

Grid:

 <ejs-grid id="Grid"

            load="onLoad()"

            allowTextWrap="true"

            allowGrouping="true"

            allowSorting="true"

            gridLines="Horizontal"

            rowDataBound="highlightIssues"

            toolbar="@(new List<string>() { "Add", "Delete", "Search" })">

    <e-grid-loadingIndicator indicatorType="Shimmer"></e-grid-loadingIndicator>

    <e-grid-editSettings allowAdding="@canEdit" allowDeleting="@canEdit" allowEditing="@canEdit" mode="Dialog" showDeleteConfirmDialog="true"></e-grid-editSettings>

    <e-data-manager url="/Supplier/[email protected]" adaptor="UrlAdaptor" insertUrl="/Supplier/AddDistribution" updateUrl="/Supplier/UpdateDistribution" removeUrl="/Supplier/DeleteDistribution"></e-data-manager>

...

Javascript:

// refresh grid after changes

function refresh() {

    var gridObj = $("#Grid").data("ejGrid");

    gridObj.refreshContent(true);

}

// highlight rows where the distribution between all orgs does not equal 100

// highlight rows where the dates don't make sense

function highlightIssues(e) {

   if (e.data.TotalDistribution != 100) {

        e.row.classList.add('bg-warning-subtle');

        var tooltip = new ej.popups.Tooltip({

            content: "The sum of the distributions between all orgs for this time period does not equal 100%."

        })

        tooltip.appendTo(e.row);

    }

    if (e.data.EndDate != null && e.data.EndDate < e.data.StartDate) {

        e.row.classList.add('bg-danger');

        var tooltip = new ej.popups.Tooltip({

            content: "The end date of this distribution is before the start date."

        })

        tooltip.appendTo(e.row);

    }

    if (e.data.NextStartDate != null && e.data.EndDate > e.data.NextStartDate) {

        e.row.classList.add('bg-danger-subtle');

        var tooltip = new ej.popups.Tooltip({

            content: "The end date of this distribution is after the start date of the next distribution. This will result in double counting any hours submissions during the overlapped time period."

        })

        tooltip.appendTo(e.row);

    }

}

Controller:

[HttpPost]

[Route("Supplier/GetSupplierOrgDistribution")]

public ActionResult GetSupplierOrgDistribution(DataManagerRequest dm, int supplierId)

{

    List<SupplierDepartmentDistributionDto> departmentDistribution = _supplierDepartmentDistributionService.GetOrgDistributionsDto(supplierId).ToList();

    return Json(new { result = departmentDistribution, count = departmentDistribution.Count() });

}

 [HttpPost]

 [Route("Supplier/AddDistribution")]

 public ActionResult AddDistribution([FromBody] CRUDModel<SupplierDepartmentDistributionDto> supplierDepartmentDistributionDto)

 {

     if (supplierDepartmentDistributionDto.Value != null)

     {

         supplierDepartmentDistributionDto.Value.DepartmentId = _corpInfoHttpClient.Org.GetOrg(supplierDepartmentDistributionDto.Value.OrgNumber).Result.DepartmentId;

         supplierDepartmentDistributionDto.Value = _supplierDepartmentDistributionService.AddOrgDistribution(supplierDepartmentDistributionDto.Value);

     }

     return Json(supplierDepartmentDistributionDto.Value);

 }

 [HttpPost]

 [Route("Supplier/UpdateDistribution")]

 public ActionResult UpdateDistribution([FromBody] CRUDModel<SupplierDepartmentDistributionDto> supplierDepartmentDistributionDto)

 {

     if (supplierDepartmentDistributionDto.Value != null)

     {

         supplierDepartmentDistributionDto.Value.DepartmentId = _corpInfoHttpClient.Org.GetOrg(supplierDepartmentDistributionDto.Value.OrgNumber).Result.DepartmentId;

         supplierDepartmentDistributionDto.Value = _supplierDepartmentDistributionService.UpdateOrgDistribution(supplierDepartmentDistributionDto.Value);

     }

     return Json(supplierDepartmentDistributionDto.Value);

 }

 [HttpPost]

 [Route("Supplier/DeleteDistribution")]

 public ActionResult DeleteDistribution([FromBody] CRUDModel<SupplierDepartmentDistributionDto> supplierDepartmentDistributionDto)

 {

     int supplierDepartmentDistributionId = int.Parse(supplierDepartmentDistributionDto.Key.ToString());

     _supplierDepartmentDistributionService.DeleteOrgDistribution(supplierDepartmentDistributionId);

     return Json(supplierDepartmentDistributionDto);

 }

[Santhosh Iruthayaraj]

Hi Jessica Goodrich,

Greetings from Syncfusion Support.

From the provided details, we understand that your requirement is to dynamically customize the row styles based on the Added/Edited/Deleted records. The “rowDataBound” event of the Grid will by default trigger for all the actions and update the respective row styles as per your requirement. We have prepared a video demonstration and sample demonstrating this for your reference, which you can find attached below.

However, if your requirement is to manually refresh the Grid to reload the entire records while Editing and Deleting, you can achieve this by calling the “refresh” method of the Grid inside the “actionComplete” with “requestType” as “save” and “delete”. Please check the code snippet below:

[Views\Home\Index.cshtml]

 

function actionComplete(args) {

    if (args.requestType === 'save' || args.requestType === 'delete') {

        let grid = document.getElementById('Grid').ej2_instances[0];

        grid.refresh(); // refresh grid to fetch data again and rerender rows

    }

}

 

This implementation is also demonstrated in the attached sample for your reference.

Please let us know if you need any further assistance.

Regards,
Santhosh I

Attachment: Sample_and_Video_99acc87b.zip

[Jessica Goodrich]

Thank you for your help!

[Santhosh Iruthayaraj]

Hi Jessica Goodrich,

We are glad to hear that the provided suggestion helped. Please let us know if you require any further assistance.

Regards,
Santhosh I