[英]Button in MudBlazor table not routing to different page
I'm new with both Blazor and MudBlazor.我是 Blazor 和 MudBlazor 的新手。 I was following along with a video on MudBlazor and I like how it can quickly have both filtering and sorting.
我正在观看有关 MudBlazor 的视频,我喜欢它如何快速进行过滤和排序。 However, now I'm trying to have some buttons for in the table row for CRUD operations on a record.
但是,现在我正在尝试在表行中添加一些按钮,以便对记录进行 CRUD 操作。 I can't seem to get it to route to another page nor have a been able to find a way to pass the record ID to a function. I've tried both a MudButton and a Bootstrap button and can't get either to work.
我似乎无法让它路由到另一个页面,也无法找到将记录 ID 传递给 function 的方法。我已经尝试了 MudButton 和 Bootstrap 按钮,但都无法正常工作.
In the code below I have a button that I would like to a different page as well as an Edit button I would like to navigate to another page while passing along the record ID.在下面的代码中,我有一个按钮,我想转到另一个页面,还有一个编辑按钮,我想在传递记录 ID 的同时导航到另一个页面。 When I run this and try to go to the Groups button nothing happens.
当我运行它并尝试将 go 发送到“组”按钮时,没有任何反应。 No errors, just not routing to another page.
没有错误,只是没有路由到另一个页面。
Anyone know what I'm missing or maybe a example I can follow?任何人都知道我缺少什么或者我可以效仿的例子吗?
<MudTable Items="@listApplications" Dense="true" Hover="true" Bordered="true" Striped="true"
Filter="new Func<Application,bool>(FilterFunc1)" @bind-SelectedItem="selectedApplication">
<ToolBarContent>
<MudTextField @bind-Value="searchString" Placeholder="Search" Adornment="Adornment.Start" AdornmentIcon="@Icons.Material.Filled.Search" IconSize="Size.Medium" Class="mt-0"></MudTextField>
</ToolBarContent>
<HeaderContent>
<MudTh>Name</MudTh>
<MudTh>Description</MudTh>
<MudTh></MudTh>
</HeaderContent>
<RowTemplate>
<MudTd DataLabel="Name">@context.Name</MudTd>
<MudTd DataLabel="Description">@context.Description</MudTd>
<MudTd>
<button type="button" class="btn btn-secondary btn-sm" onclick="GoToGroups()">Groups</button>
<button class="btn btn-primary btn-sm" >
Edit
</button>
<button type="button" class="btn btn-danger btn-sm">Delete</button>
</MudTd>
</RowTemplate>
<PagerContent>
<MudTablePager />
</PagerContent>
</MudTable>
@code {
private List<Application>? listApplications;
private string searchString = "";
private Application selectedApplication = null;
protected override async Task OnInitializedAsync()
{
listApplications = await _db.GetApplications();
}
private bool FilterFunc1(Application app) => FilterFunc(app, searchString);
private bool FilterFunc(Application app, string searchString)
{
if (string.IsNullOrWhiteSpace(searchString))
return true;
if (app.Description.Contains(searchString, StringComparison.OrdinalIgnoreCase))
return true;
if (app.Name.Contains(searchString, StringComparison.OrdinalIgnoreCase))
return true;
return false;
}
void ShowApplication(int id)
{
NavigationManager.NavigateTo($"ApplicationMgmt/{id}");
}
void CreateNewApplication()
{
NavigationManager.NavigateTo("ApplicationMgmt");
}
void GoToGroups()
{
NavigationManager.NavigateTo("Groups");
}
}
In Blazor you specify an event handler using the syntax @on{DOM EVENT}="{DELEGATE}"
.在 Blazor 中,您使用语法
@on{DOM EVENT}="{DELEGATE}"
指定事件处理程序。
So you need to use @onclick="GoToGroups"
instead of onclick="GoToGroups()"
.所以你需要使用
@onclick="GoToGroups"
而不是onclick="GoToGroups()"
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.