Detail Template Events

[paul stanley]

Hi

Is there an event that fires when the detail template icon is clicked on in SFGrid?

[Rahul Narayanasamy]

Hi Paul, 

Greetings from Syncfusion. 

Query: Is there an event that fires when the detail template icon is clicked on in SFGrid? 

We suggest you to achieve your requirement using DetailDataBound event of Grid. This event will be triggered when opening a detail template. Refer our UG documentation for your reference   

https://blazor.syncfusion.com/documentation/datagrid/events/#detaildatabound  

Please let us know if you have any concerns. 

Regards, 

Rahul 

[David Eisler]

Hi,

DetailDataBound event is called only once (when is the detail opened at first time).

I need some event where I can load data (in async method) for detail template. Is there such an event?
Thank you,
David

[Rahul Narayanasamy]

Hi David,

The DetailDataBound event will be triggered while opening the DetailTemplate for the first time only. Based on your scenario, we suggest you to access and fetch data inside the DetailTemplate itself instead of using the DetailDataBound event handler. Please refer to and use the code below,

 

    <GridTemplates>

        <DetailTemplate>

            @{

                var Data = (context as EmployeeData);

                Orders = _ForecastService.GetApps(Data.EmployeeID).GetAwaiter().GetResult();

                <SfGrid DataSource="@Orders">

                    <GridColumns>

                        <GridColumn Field=@nameof(Order.OrderID) HeaderText="First Name" Width="110"> </GridColumn>

                        <GridColumn Field=@nameof(Order.ShipCountry) HeaderText="Title" Width="110"></GridColumn>

                    </GridColumns>

                </SfGrid>

            }

        </DetailTemplate>

    </GridTemplates>

 

We have also prepared a sample based on this scenario for your convenience, please download and refer to the sample from the link below,

Please get back to us if you need further assistance.

Regards,

Rahul

Attachment: Sample_1c221505.zip

[David Eisler]

Hi Rahul,

Unfortunately, it's not working for me. You haven't any async operation in your example in "GetApps" method. I need to perform an async operation. I'm loading detail data from API. When I edit your method like below, it stops working. DetailTemplate never expand with no error.

public async Task<List<Order>> GetApps(int id)
{
    await Task.Delay(100);

        var rng = new Random();
        return await Task.FromResult(Enumerable.Range(1, 6).Select(x => new Order
        {
                OrderID = 1000 + x,
                ShipCountry = new string[] { "Denmark", "Germany", "Austria", "Brazil", "Switzerland", "Finland" }[id],
         }).ToList());
}

In my case (wasm app) I'm getting error at .GetAwaiter().GetResult().

Unhandled exception rendering component: Cannot wait on monitors on this runtime.
System.PlatformNotSupportedException: Cannot wait on monitors on this runtime.
   at System.Threading.Monitor.ObjWait(Boolean exitContext, Int32 millisecondsTimeout, Object obj)
   at System.Threading.Monitor.Wait(Object obj, Int32 millisecondsTimeout, Boolean exitContext)
   at System.Threading.Monitor.Wait(Object obj, Int32 millisecondsTimeout)
   at System.Threading.ManualResetEventSlim.Wait(Int32 millisecondsTimeout, CancellationToken cancellationToken)
   at System.Threading.Tasks.Task.SpinThenBlockingWait(Int32 millisecondsTimeout, CancellationToken cancellationToken)
   at System.Threading.Tasks.Task.InternalWaitCore(Int32 millisecondsTimeout, CancellationToken cancellationToken)
   at System.Threading.Tasks.Task.InternalWait(Int32 millisecondsTimeout, CancellationToken cancellationToken)
...

Best regards,

David

[Rahul Narayanasamy]

Hi David,

Sorry for the inconvenience.

Based on your case, we suggest you to use the DetailDataBound event. The DetailDataBound event will be triggered each time when you open the DetailTemplate. Find the below code snippets for your reference.

https://blazor.syncfusion.com/documentation/datagrid/events#detaildatabound

 

<SfGrid DataSource="@Employees" @ref="Grid" Height="315px">

    <GridEvents DetailDataBound="DetailDataBound" TValue="EmployeeData"></GridEvents>

    <GridTemplates>

        <DetailTemplate>

            @{

                var Data = (context as EmployeeData);

              

                <SfGrid DataSource="@Orders">

                    <GridColumns>

                        <GridColumn Field=@nameof(Order.OrderID) HeaderText="First Name" Width="110"> </GridColumn>

                        <GridColumn Field=@nameof(Order.ShipCountry) HeaderText="Title" Width="110"></GridColumn>

                    </GridColumns>

                </SfGrid>

            }

        </DetailTemplate>

    </GridTemplates>

    <GridColumns>

        <GridColumn Field=@nameof(EmployeeData.FirstName) HeaderText="First Name" Width="110"> </GridColumn>

        . .

    </GridColumns>

</SfGrid>

 

@code{

    SfGrid<EmployeeData> Grid;

    public async Task DetailDataBound(DetailDataBoundEventArgs<EmployeeData> args)

    {

        //here you can call your async method and get data

        Orders = await _ForecastService.GetApps(args.Data.EmployeeID);

    }

 

 

}

If it does not meet your requirement, then could you please more details(sample, requirement case) about your requirement? It will be helpful to validate and provide a better solution.

Regards,

Rahul

[David Eisler]

Hi Rhaul

I tried some things and I found that I had some workaround in "CellSelected" event handler.

        public async Task CellSelectHandler(CellSelectEventArgs<PartnerObjednavkaItemViewModel> args)
        {
            if (1.9 < args.CellIndex && args.CellIndex < 2.1)
            {
                var fields = await ViewModel.Grid.GetColumnFieldNamesAsync();
                await ViewModel.Grid.EditCellAsync(args.RowIndex, fields[2]);
            }
        }

I deleted it and "DetailDataBound" started to work as expectet.

Thank you,

David

[Rahul Narayanasamy]

Hi David,

Thanks for the update.

We are happy to hear that the problem was resolved. Please get back to us if you need further assistance.

Regards,

Rahul