Using button in Sfgrid

1 Reply
2 Participants
Marked answer

Created by
MA Martin

Platform
Blazor

Platform
Blazor

Control
Grid

Created On
Jan 7, 2021 11:33 AM UTC

Last Activity On
Jan 8, 2021 04:35 AM UTC

Want to subscribe?
SIGN IN

Hi, I have created a sfgrid that contains a summarised 7 key fileds of an entry in the database. I have added an sfbutton to the first column and would like the user to be able to click the button and it load the full database entry onto a new page passing the value from column 1 (ID of entry) as a parameter to load the correct information. I cannot find how to reference the ID from the sfgrid as the button click event is fired before the row selection is made.

</Template>

</GridColumn>

</GridColumns>

</SfGrid>

@code {

SfGrid<TicketDetails> Grid_Resolved;

SfButton EditBtnResolved;

private void onToggleClick_Resolved(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)

{

//What needs to go here???

}

1 Reply 1 reply marked as answer

VN Vignesh Natarajan Syncfusion Team January 8, 2021 04:35 AM UTC

Hi Martin,

Thanks for contacting Syncfusion support.

Query: “ I cannot find how to reference the ID from the sfgrid as the button click event is fired before the row selection is made.”

We have analyzed your query and we understand that you want to pass the record detail as an argument to button click event. We suggest you to achieve your requirement by accessing the Template context. Refer the below code example.

<SfGrid DataSource="@tickets_resolved" AllowPaging="true" @ref="@Grid_Resolved">

<GridPageSettings PageSize="6"></GridPageSettings>

<GridColumns>

<GridColumn Width="50">

<Template>

var ticket = (context as TicketDetails);

<SfButton @ref="EditBtnResolved" @onclick="@((args) => onToggleClick_Resolved(args,ticket))" IsToggle="true" IsPrimary="true">Edit</SfButton>

}

</Template>

</GridColumn>

<GridColumn Field=@nameof(TicketDetails.RequestID) HeaderText="Request ID" TextAlign="Syncfusion.Blazor.Grids.TextAlign.Center" Width="65"></GridColumn>

. . . . . .

</GridColumns>

</SfGrid>

@code{

SfGrid<TicketDetails> Grid_Resolved;

SfButton EditBtnResolved;

public List<TicketDetails> tickets_resolved { get; set; }

private void onToggleClick_Resolved(Microsoft.AspNetCore.Components.Web.MouseEventArgs args, TicketDetails tick)

{

var val = tick.RequestID; // access the record value here.

}

For your convenience we have prepared a sample which can be downloaded from below