Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

No buttons (or other interactive elements) work when I use a data-bound object

$
0
0

I’m trying to display user identities and fetch a list of users, but buttons stop functioning if I use ApplicationUser (inherited from IdentityUser) retrieved via UserManager.

@attribute [Authorize] @using Microsoft.EntityFrameworkCore@using Radzen.Blazor@using Microsoft.AspNetCore.Authorization@using Microsoft.AspNetCore.Identity@using jeremy.server.Data@rendermode InteractiveServer@inject UserManager<ApplicationUser> UserManager<RadzenCard><RadzenDataGrid @ref="grid" AllowSorting="true"                 Data="@users"                AllowPaging="true" PageSize=20 Density="Density.Compact" ShowPagingSummary="true"                TItem="ApplicationUser" SelectionMode="DataGridSelectionMode.Single"                AllowFiltering="true"                AllowColumnResize="true"                AllowRowSelectOnRowClick="true"><Columns><RadzenDataGridColumn TItem="ApplicationUser" Property="UserName" Title="UserName" Width="300px" /><RadzenDataGridColumn TItem="ApplicationUser" Property="Email" Title="Email" Width="300px" /><RadzenDataGridColumn Title="Actions" Width="150px"><Template Context="user"><RadzenButton Icon="edit" Click="@(() => EditUser(user.Id))" /><RadzenButton Icon="delete" Click="@(() => DeleteUser(user.Id))"                                  ButtonStyle="ButtonStyle.Danger" /></Template></RadzenDataGridColumn></Columns></RadzenDataGrid><RadzenButton Text="Add User" Click="@AddUser"                  ButtonStyle="ButtonStyle.Primary" Icon="add_circle" /></RadzenCard>@code {    private RadzenDataGrid<ApplicationUser> grid;    private IEnumerable<ApplicationUser> users;     protected override async Task OnInitializedAsync()    {        await base.OnInitializedAsync();        users = UserManager.Users.ToListAsync().Result;    }    protected async Task AddUser() => this.EditUser(String.Empty);    protected async Task EditUser(string userId)    {        var user = new ApplicationUser { UserName = "TestName", Email = "test@test.com" };        var result = await UserManager.CreateAsync(user, "12345");        this.grid.Reload();    }    protected async Task DeleteUser(string userId)    {        var user = users.FirstOrDefault(u => u.Id == userId);        if (user != null)        {            var result = await UserManager.DeleteAsync(user);        }    }}

And the browser console does not display errors.

However, if I cast UserManager.Users to my custom UserModel type, the issue disappears.

public class UserModel{    public string Id { get; set; }    public string UserName { get; set; }    public string? Email { get; set; }}
   protected override async Task OnInitializedAsync()    {        await base.OnInitializedAsync();        users = UserManager.Users.Select(x => new UserModel()        {            Id = x.Id,            UserName = x.UserName ?? string.Empty,             Email = x.Email        });     }

Why? Blazor is supposed to work directly with data.


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>