Problem with command and record double click when using groups & aggregates

4 Replies
2 Participants

Created by
MA Matthew

Platform
Blazor

Platform
Blazor

Control
Grid

Created On
Mar 11, 2020 07:01 PM UTC

Last Activity On
Mar 13, 2020 12:22 PM UTC

Want to subscribe?
SIGN IN

                                    @{
                                        var aggregate = (context as AggregateTemplateContext);

Total for Day: @aggregate.Sum

                                    }


                                    @{
                                        var aggregate = (context as AggregateTemplateContext);

Total for Timesheet: @aggregate.Sum

                                    }

This produces something liek the following:

Double clicking a row will toggle the confrimed state

Which works perfectly well in the first group. However, if I double click the first row in the second group.....

It sets the confirmed status of the second item in the group - or in some instances just does nothing.

I am matching the underlying data using a GUID as an identifier, for some reason the event dispatcher is sending the wrong record to my event handler - I have checked the data flows and this is the case - can you have a look please?

Thanks

4 Replies

VN Vignesh Natarajan Syncfusion Team March 12, 2020 06:09 AM UTC

Hi Matthew,

Thanks for contacting Syncfusion support.

Query: “It sets the confirmed status of the second item in the group - or in some instances just does nothing”

From your query we understand that you are facing isse while toggling the selected record checkbox value. But we need some more details to validate the reported issue at our end. So kindly share the following details.

Share your Grid code example.
Share the details how you are toggling the checkbox value on double click (i.e.) either using RecordDoubleClick event / updating the Confirmed column.
Kindly confirm whether the Confirmed column is Boolean column or CheckBox column.?
You have also mentioned that Event dispatched is sending the wrong record details. Can you please share details about the event whether it is RecordDoubleClick or RowSelected event?.
Also confirm you are facing the issue if Group Aggregates is not defined in Grid?.

Above requested details will be helpful for us to validate the reported issue at our end and providing the solution as soon as possible.

Regards,

Vignesh Natarajan.

MA Matthew March 12, 2020 12:30 PM UTC

Hi, in addition to posting the code below - I've attached the file as well as posting code seems to sometime not always work here.

@page "/"
@using Syncfusion.EJ2.Blazor.Grids
@inject IJSRuntime _ijsRuntime

<h3>Grid Grouping Example</h3>

<div class="row">
    <div class="col">
        <EjsGrid TValue="TimesheetRowItem" @ref="theGrid" AllowGrouping="true" DataSource="@TimesheetItems">
            <GridEvents CommandClicked="@OnCommandClicked" OnRecordDoubleClick="OnRecordDoubleClick" TValue="TimesheetRowItem"></GridEvents>
            <GridGroupSettings Columns="@GroupColumns"></GridGroupSettings>
            <GridAggregates>
                <GridAggregate>
                    <GridAggregateColumns>
                        <GridAggregateColumn Field="@nameof(TimesheetRowItem.Units)" Type="AggregateType.Sum" Format="N3" ColumnName="Units">
                            <GroupFooterTemplate>
                                @{
                                    var aggregate = (context as AggregateTemplateContext);
                                    <div>Total for Day: @aggregate.Sum</div>
                                }
                            </GroupFooterTemplate>
                            <FooterTemplate>
                                @{
                                    var aggregate = (context as AggregateTemplateContext);
                                    <div>Total for Timesheet: @aggregate.Sum</div>
                                }
                            </FooterTemplate>
                        </GridAggregateColumn>
                    </GridAggregateColumns>
                </GridAggregate>
            </GridAggregates>
            <GridColumns>
                <GridColumn Field=@nameof(TimesheetRowItem.Id) HeaderText="Id"></GridColumn>
                <GridColumn Field=@nameof(TimesheetRowItem.DayOfWeek) HeaderText="Day"></GridColumn>
                <GridColumn Field=@nameof(TimesheetRowItem.DisplayDate) HeaderText="Date" AutoFit="true" TextAlign="TextAlign.Left"></GridColumn>
                <GridColumn Field=@nameof(TimesheetRowItem.WorkcodeName) HeaderText="Workcode" AutoFit="true" TextAlign="TextAlign.Left"></GridColumn>
                <GridColumn Field=@nameof(TimesheetRowItem.SiteName) HeaderText="Site" AutoFit="true" TextAlign="TextAlign.Left"></GridColumn>
                <GridColumn Field=@nameof(TimesheetRowItem.DisplayStartTime) HeaderText="Start Time" AutoFit="true" TextAlign="TextAlign.Left"></GridColumn>
                <GridColumn Field=@nameof(TimesheetRowItem.DisplayEndTime) HeaderText="End Time" AutoFit="true" TextAlign="TextAlign.Left"></GridColumn>
                <GridColumn Field=@nameof(TimesheetRowItem.Units) HeaderText="Units" Type="ColumnType.Number" Format="N3" TextAlign="TextAlign.Right"></GridColumn>
                <GridColumn Field=@nameof(TimesheetRowItem.Confirmed) HeaderText="Confirmed" AutoFit="false" DisplayAsCheckBox="true" TextAlign="TextAlign.Left"></GridColumn>
                <GridColumn HeaderText="Action" Width="120">
                    <GridCommandColumns>
                        <GridCommandColumn Type="CommandButtonType.Edit" Title="Edit Timesheet Item" ButtonOption="@(new CommandButtonOptions() { IconCss = "e-icons e-edit", CssClass = "e-flat" })"></GridCommandColumn>
                    </GridCommandColumns>
                </GridColumn>
            </GridColumns>
        </EjsGrid>
    </div>
</div>

@code{
    EjsGrid<TimesheetRowItem> theGrid;
    private string[] GroupColumns = (new string[] { "DisplayDate" });

    public List<TimesheetRowItem> TimesheetItems = new List<TimesheetRowItem>()
    {
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Monday", DisplayDate="09/03/2020", WorkcodeName="Surgery", SiteName="Main Practice", DisplayStartTime="09:00", DisplayEndTime="12:30", Units=3.5M, Confirmed=false },
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Monday", DisplayDate="09/03/2020", WorkcodeName="Surgery", SiteName="Main Practice", DisplayStartTime="13:30", DisplayEndTime="17:30", Units=4M, Confirmed=false },
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Tuesday", DisplayDate="10/03/2020", WorkcodeName="Surgery", SiteName="Main Practice", DisplayStartTime="09:00", DisplayEndTime="12:30", Units=3.5M, Confirmed=false },
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Tuesday", DisplayDate="10/03/2020", WorkcodeName="Surgery", SiteName="Main Practice", DisplayStartTime="13:30", DisplayEndTime="17:30", Units=4M, Confirmed=false },
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Wednesday", DisplayDate="11/03/2020", WorkcodeName="Surgery", SiteName="Annex", DisplayStartTime="09:00", DisplayEndTime="12:30", Units=3.5M, Confirmed=false },
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Wednesday", DisplayDate="11/03/2020", WorkcodeName="Surgery", SiteName="Annex", DisplayStartTime="13:30", DisplayEndTime="17:30", Units=4M, Confirmed=false },
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Thursday", DisplayDate="12/03/2020", WorkcodeName="Surgery", SiteName="Main Practice", DisplayStartTime="09:00", DisplayEndTime="12:30", Units=3.5M, Confirmed=false },
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Thursday", DisplayDate="12/03/2020", WorkcodeName="Surgery", SiteName="Main Practice", DisplayStartTime="13:30", DisplayEndTime="17:30", Units=4M, Confirmed=false },
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Friday", DisplayDate="13/03/2020", WorkcodeName="Surgery", SiteName="Annex", DisplayStartTime="09:00", DisplayEndTime="12:30", Units=3.5M, Confirmed=false },
        new TimesheetRowItem(){ Id=Guid.NewGuid().ToString(), DayOfWeek="Friday", DisplayDate="13/03/2020", WorkcodeName="Surgery", SiteName="Main Practice", DisplayStartTime="13:30", DisplayEndTime="17:30", Units=4M, Confirmed=false },
    };

    public class TimesheetRowItem
    {
        public string Id { get; set; }
        public string DayOfWeek { get; set; }
        public string DisplayDate { get; set; }
        public string WorkcodeName { get; set; }
        public string SiteName { get; set; }
        public string DisplayStartTime { get; set; }
        public string DisplayEndTime { get; set; }
        public decimal Units { get; set; }
        public bool Confirmed { get; set; }
    }

    protected async Task OnCommandClicked(CommandClickEventArgs<TimesheetRowItem> args)
    {
        // log id to console
        await LogMessage("Id selected: " + args.RowData.Id);

        // get the item from the list
        var item = TimesheetItems.Where(x => x.Id == args.RowData.Id).FirstOrDefault();

        if (item != null)
        {
            // toggle confirmed
            item.Confirmed = !item.Confirmed;

            // refresh the grid
            await theGrid.DataBind();
            theGrid.Refresh();
        }
    }

    protected async Task OnRecordDoubleClick(RecordDoubleClickEventA

Attachment: Index_2a8d8e4d.rar

MA Matthew March 12, 2020 12:33 PM UTC

Yep, not all the code would paste into the message and I could not type any more in :)

Anyway the code example in the attached file on the previous reply should answer all of your questions.

Also, this is for Server-Side blazor - I have added a little bit of code which writes the Id of the record passed in the events to the console to help you match things up.

Thanks

VN Vignesh Natarajan Syncfusion Team March 13, 2020 12:22 PM UTC

Hi Matthew,

Thanks for sharing the requested details.

We are able to reproduce the reported issue at our end. We have considered it as a bug and logged defect report for the same “RecordDoubleClick event argument value is wrong when grouping aggregate in enabled in Grid” . At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the defect fix in our next Bi-Weekly release which is expected to be rolled out on or before 15^th April 2020.

You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.

Feedback Link : https://www.syncfusion.com/feedback/12730/recorddoubleclick-event-argument-value-is-wrong-when-grouping-aggregate-in-enabled

Till then we appreciate your patience.

Regards,

Vignesh Natarajan.

Need More Help?

Get personalized assistance from our support team.

Contact Support

4 Replies
2 Participants
Want to subscribe?
SIGN IN
Created by
MA Matthew
Platform
Blazor
Control
Grid
Created On
Mar 11, 2020 07:01 PM UTC
Last Activity On
Mar 13, 2020 12:22 PM UTC

Need More Help?

Get personalized assistance from our support team.

Contact Support