We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

OnActionComplete Only Fires On First Edit When Grid Is Grouped

Thread ID:

Created:

Updated:

Platform:

Replies:

150808 Jan 21,2020 12:52 AM UTC Jan 23,2020 11:58 AM UTC Blazor 6
loading
Tags: Grid
Jonah Coleman
Asked On January 21, 2020 12:52 AM UTC

1) Use a blazor grid and allow grouping.  Edit Mode is Normal.
2) Add a OnActionComplete event, and have it do something to show that it has been called.
3) Without grouping applied, you'll get a call of the OnActionComplete event every time you edit a cell.
4) With grouping applied, only the first one calls and subsequent edits do not call.

  <EjsGrid DataSource="@Orders" @ref="theGrid" AllowGrouping="true" AllowSorting="true">
        <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="Syncfusion.EJ2.Blazor.Grids.EditMode.Normal"></GridEditSettings>
        <GridEvents OnActionComplete="ActionCompletedHandler" TValue="Order"></GridEvents>
        <GridColumns>
            <GridColumn Field=@nameof(Order.OrderID) IsPrimaryKey="true" HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn>
            <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" Width="150"></GridColumn>
            <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn>
            <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn>
        </GridColumns>
    </EjsGrid>

@code{
    public List<Order> Orders { get; set; }
    protected EjsToast ToastObj;
    protected EjsGrid<Order> theGrid;
    protected override void OnInitialized()
    {
        Orders = Enumerable.Range(1, 75).Select(x => new Order()
        {
            OrderID = 1000 + x,
            CustomerID = (new string[] { "ALFKI", "ANANTR", "ANTON", "BLONP", "BOLID" })[new Random().Next(5)],
            Freight = 2.1 * x,
            OrderDate = DateTime.Now.AddDays(-x),
        }).ToList();
    }

    public class Order
    {
        public int? OrderID { get; set; }
        public string CustomerID { get; set; }
        public DateTime? OrderDate { get; set; }
        public double? Freight { get; set; }
    }

    public async Task ActionCompletedHandler(ActionEventArgs<Order> args)
    {
        // Here you can customize your code
        if ((args?.Action ?? "").Length > 0)
        {
            ShowPopupInfo($"{args.Action} {args.Data == null} {args.RowIndex}");
            theGrid.SelectCellsByRange(-1);
        }
        
    }

    private void ShowPopupInfo(string content)
    {
        ShowPopupInternal("Information!", content, "e-toast-info", "e-info toast-icons");
    }
    private void ShowPopupInternal(string title, string content, string cssClass, string icon)
    {
        var model = new ToastModel { Title = title, Content = content, CssClass = cssClass, Icon = icon };
        ToastObj.Show(model);
    }


}

<EjsToast @ref="ToastObj" ID="toast_type">
    <ToastPosition X="Left"></ToastPosition>
</EjsToast>

Renjith Singh Rajendran [Syncfusion]
Replied On January 21, 2020 12:54 PM UTC

Hi Jonah, 

Thanks for contacting Syncfusion support. 

We tried to reproduce the reported problem with our latest version 17.4.43. But the “OnActionComplete” event triggers each time during editing in a Grouped Grid. We have prepared a sample by using the codes which you have shared with us. Please download the sample form the link below, 

If you are still facing difficulties then kindly share with us the following details for better assistance. 
  1. Share the Syncfusion version details.
  2. Share the exact scenario or proper replication procedure.
  3. Share the sample which you have tried from your side.
  4. Share the details of script error if any occurred in the browser console.
  5. If possible, kindly reproduce the problem with the attached sample and share with us for further analysis.

And also, we suggest you to bind the “OnActionFailure” event of Grid. This event will be triggered each time there is a failure in Grid, and in the arguments of this event handler you can get the error details. If this event triggered, then kindly share the details you get in the argument of this event hanlder. 

The provided information will help us analyze the problem, and provide you a solution as early as possible. 

Regards, 
Renjith Singh Rajendran. 


Jonah Coleman
Replied On January 21, 2020 03:40 PM UTC

Using your sample, when grouped edits on the first 5 rows will work properly.  Edits on any index above that will not.  I changed your sample only to add a counter that increments every time the event is called.  No failure event occurs.

https://screencast-o-matic.com/watch/cYVrogvsdE


@using Syncfusion.EJ2.Blazor.Grids
@using Syncfusion.EJ2.Blazor.Notifications
@using Newtonsoft.Json


<h1>@Counter</h1>
<EjsGrid DataSource="@Orders" @ref="theGrid" AllowGrouping="true" AllowSorting="true">
    <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="Syncfusion.EJ2.Blazor.Grids.EditMode.Normal"></GridEditSettings>
    <GridEvents OnActionComplete="ActionCompletedHandler" OnActionFailure="ActionFailureHandler" TValue="Order"></GridEvents>
    <GridColumns>
        <GridColumn Field=@nameof(Order.OrderID) IsPrimaryKey="true" HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn>
        <GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" Width="150"></GridColumn>
        <GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn>
        <GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn>
    </GridColumns>
</EjsGrid>

@code{
    public List<Order> Orders { get; set; }
    int Counter = 0;
    protected EjsToast ToastObj;
    protected EjsGrid<Order> theGrid;
    protected override void OnInitialized()
    {
        Orders = Enumerable.Range(1, 75).Select(x => new Order()
        {
            OrderID = 1000 + x,
            CustomerID = (new string[] { "ALFKI", "ANANTR", "ANTON", "BLONP", "BOLID" })[new Random().Next(5)],
            Freight = 2.1 * x,
            OrderDate = DateTime.Now.AddDays(-x),
        }).ToList();
    }

    public class Order
    {
        public int? OrderID { get; set; }
        public string CustomerID { get; set; }
        public DateTime? OrderDate { get; set; }
        public double? Freight { get; set; }
    }
    public async Task ActionFailureHandler(Syncfusion.EJ2.Blazor.Grids.FailureEventArgs args)
    {
        Counter = -10000;
    }

    public async Task ActionCompletedHandler(ActionEventArgs<Order> args)
    {
        // Here you can customize your code
        if ((args?.Action ?? "").Length > 0)
        {
            Counter++;
        }

    }
}



Jonah Coleman
Replied On January 21, 2020 03:41 PM UTC

BTW appreciate the response.

Renjith Singh Rajendran [Syncfusion]
Replied On January 22, 2020 11:26 AM UTC

Hi Jonah, 

Thanks for your update. 

We tried to reproduce the problem with the same replication procedure as like the one in the video demo. But we could not face the problem, the OnActionComplete triggers fine from our side. We are attaching the video demo for your reference, please download the demo from the link below, 
 
We suggest you to try running the application after clearing the browser cache, and if you are still facing difficulties, then kindly share with us the following details for better assistance, 

  1. Share the sample which you have tried from your side.
  2. Have you done any other changes in the sample attached in our previous update?
  3. Share with us Syncfusion version details you are using in your machine. We have provided sample with version 17.4.43.

Regards, 
Renjith Singh Rajendran. 


Jonah Coleman
Replied On January 23, 2020 12:47 AM UTC

Using your sample I continue to see the behavior.
There are errors on the Chrome console (see the end of the video):


https://screencast-o-matic.com/watch/cYV0cmvNEZ


ejs.interop.min.js:1 Cannot read property 'items' of undefined
TypeError: Cannot read property 'items' of undefined
    at t.getGroupedRecords (https://cdn.syncfusion.com/ej2/17.4.43/dist/ej2.min.js:10:6069011)
    at t.generateRows (https://cdn.syncfusion.com/ej2/17.4.43/dist/ej2.min.js:10:6068851)
    at e.refreshContentRows (https://cdn.syncfusion.com/ej2/17.4.43/dist/ej2.min.js:10:6076770)
    at e. (https://cdn.syncfusion.com/ej2/17.4.43/dist/ej2.min.js:10:6129500)
    at e.notify (https://cdn.syncfusion.com/ej2/17.4.43/dist/ej2.min.js:10:483325)
    at t.e.trigger (https://cdn.syncfusion.com/ej2/17.4.43/dist/ej2.min.js:10:502097)
    at e.dataManagerSuccess (https://cdn.syncfusion.com/ej2/17.4.43/dist/ej2.min.js:10:6127941)
    at e.dataSuccess (https://cdn.syncfusion.com/ej2/17.4.43/dist/ej2.min.js:10:6253355)
    at Object.invokeMethod (https://cdn.syncfusion.com/ej2/17.4.43/dist/ejs.interop.min.js:1:9312)
    at https://localhost:44311/_framework/blazor.server.js:8:31421

Renjith Singh Rajendran [Syncfusion]
Replied On January 23, 2020 11:58 AM UTC

Hi Jonah, 

Thanks for your update. 

We have created a new incident under your account. Kindly follow up that incident for future updates regarding this query. 

Regards, 
Renjith Singh Rajendran. 




CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon