DataGrid editing on separate page/component

user_1549450 0
Viewed 369

I have a Blazorise DataGrid working, now I want to add a button to edit the record on a different page/component (not inline or popup).

My raw starting grid markup:

<DataGrid TItem="Year" Data="@years" Sortable="true" PageSize="30" UseInternalEditing="false">
    <DataGridCommandColumn TItem="Year">
        <EditCommandTemplate>
            <Button Color="Color.Primary" Clicked="@((e) => OnYearEdit(e))">Edit</Button>
        </EditCommandTemplate>
    </DataGridCommandColumn>
    <DataGridColumn TItem="Year" Field="@nameof(Year.IsActive)" Caption="Active?"></DataGridColumn>
    <DataGridColumn TItem="Year" Field="@nameof(Year.YearId)" Caption="ID"></DataGridColumn>
</DataGrid>

Then I want the event called when the button is clicked passing in either the id or year object:

void OnYearEdit(int yearId)
{
    NavigationManager.NavigateTo("/yearedit/1");
}

How can I achieve that?

blazorise blazor
1 Answers

Mladen was kind enough to provide a quick response. Basically, I just needed to use a DisplayTemplate:

<DataGridColumn TItem="Year" Field="@nameof(Year.YearId)" Caption="YearId" Editable="true">
    <DisplayTemplate>
        <Button class="btn btn-sm btn-info" Clicked="@(()=>NavigationManager.NavigateTo($"yearedit/{context.YearId}"))">Edit</Button>
    </DisplayTemplate>
</DataGridColumn>
user_15494500
Related