Hi there,
I'm verry new to Blazor and also Radzen.
I have some trouble with nearly anything in Blazor and Radzen.
I read the "Get Started" page and set everything up like its written.
Now i try to implement my first own Page that just simple show a DataGrid.
Up to the point to display all my Databaserecords everything works.
But... I also use the Pager.
If i press on any Number or Arrows, nothing happen.
I cant page through all my Entities.
Why?
Next:
I use a Template for one of the RadzenDataGridColumn to add an edit Button.
The code looks good, but nothing happen when i click on the button.
Why? oO
Next:
Selection.... it looks like that it also dose not work.
in i add the Attribute SelectionMode="DataGridSelectionMode.Single" and @bind-Value=@selectedEmployees
But if i click on an other Row, nothing happen. The first Row is still selected.
Because of all that issues i try to inject the DialogService and run a simple Alert message:
DialogService.Alert("FOO"); at the inizialisation of the component.
On the Inizialization... no Dialog pops up...
Now i'm sure, i made on any step a misstake but i cant find it.
All my Services, Models, Views and ViewModels working fine (to Display Data).
All Nuget packages are up to date.
And here my Code:
Programm.cs:
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using Microsoft.EntityFrameworkCore;
using PIA.Metall.WEB.Components;
using PIA.Metall.WEB.Models;
using PIA.Metall.WEB.Services;
using Radzen;
var builder = WebApplication.CreateBuilder(args);
var connectionString = builder.Configuration.GetConnectionString("Default") ?? throw new NullReferenceException("No connection string in config!");
// Add services to the container.
builder.Services.AddRazorComponents()
.AddInteractiveServerComponents();
builder.Services.AddRadzenComponents();
builder.Services.AddScoped<DialogService>();
builder.Services.AddScoped<NotificationService>();
builder.Services.AddScoped<TooltipService>();
builder.Services.AddScoped<ContextMenuService>();
// EmployeeService is the Service Class to handle Database calls (EntityFramework)
builder.Services.AddSingleton<EmployeeService>();
// Add the dbContext
builder.Services.AddDbContextFactory<dbContext>((DbContextOptionsBuilder options) => options.UseMySql(connectionString, ServerVersion.Parse("10.3.39-mariadb")));
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Error", createScopeForErrors: true);
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseAntiforgery();
app.MapRazorComponents<App>()
.AddInteractiveServerRenderMode();
app.Run();
App.razor:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<base href="/" />
<link rel="stylesheet" href="bootstrap/bootstrap.min.css" />
<link rel="stylesheet" href="app.css" />
<link rel="stylesheet" href="PIA.Metall.WEB.styles.css" />
<link rel="icon" type="image/png" href="favicon.png" />
<link rel="stylesheet" href="_content/Radzen.Blazor/css/dark-base.css">
<HeadOutlet />
</head>
<body>
<Routes />
<script src="_framework/blazor.web.js"></script>
<script src="_content/Radzen.Blazor/Radzen.Blazor.js"></script>
</body>
</html>
My View:
@page "/employee-workspace"
@using PIA.Metall.WEB.ViewModels.EmployeeViewModels
@using PIA.Metall.WEB.Services
@using PIA.Metall.WEB.Models;
@using Radzen
@using Radzen.Blazor
@using System.Collections.ObjectModel
@inject EmployeeService service
@inject NavigationManager Manager
@inject DialogService DialogService
<h3>Mitarbeiterverwaltung</h3>
@if (selectedEmployees?.Any() == true)
{
<!-- Just for debugging -->
<div style="margin-left: 16px">
Ausgewählter Mitarbeiter @selectedEmployee.FirstName @selectedEmployee.LastName
</div>
}
<RadzenDataGrid AllowFiltering="true" FilterPopupRenderMode="PopupRenderMode.OnDemand" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" AllowPaging="true" PageSize="4"
AllowSorting="true" Data="@ViewEmployees" ColumnWidth="200px"
SelectionMode="DataGridSelectionMode.Single" @bind-Value=@selectedEmployees
PagerPosition="PagerPosition.Bottom" >
<Columns>
<RadzenDataGridColumn TItem="Employee" Property="Id" Title="ID" Width="50px" TextAlign="TextAlign.Center" />
<RadzenDataGridColumn TItem="Employee" Property="FirstName" Title="Vorname" Width="50px" TextAlign="TextAlign.Center" />
<RadzenDataGridColumn TItem="Employee" Property="LastName" Title="Nachname" Width="50px" TextAlign="TextAlign.Center" />
<RadzenDataGridColumn TItem="Employee" Property="Address" Title="Adresse" Width="50px" TextAlign="TextAlign.Center" />
<RadzenDataGridColumn TItem="Employee" Property="PostalCode" Title="Postleitzahl" Width="50px" TextAlign="TextAlign.Center" />
<RadzenDataGridColumn TItem="Employee" Property="City" Title="Stadt" Width="50px" TextAlign="TextAlign.Center" />
<RadzenDataGridColumn TItem="Employee" Property="State" Title="Land" Width="50px" TextAlign="TextAlign.Center" />
<RadzenDataGridColumn TItem="Employee" Property="Job" Title="Jobbezeichnung" Width="50px" TextAlign="TextAlign.Center" />
<RadzenDataGridColumn TItem="Employee" Property="HoulyWage" Title="Stundenlohn" Width="50px" TextAlign="TextAlign.Center" />
<RadzenDataGridColumn TItem="Employee" Property="Id" Title="Bearbeiten" Width="50px" TextAlign="TextAlign.Center" >
<Template Context="data">
<RadzenButton Click=@(args => onEditClicked(data)) Text="Edit" />
</Template>
</RadzenDataGridColumn>
</Columns>
</RadzenDataGrid>
@code {
private EmployeeWorkspaceViewModel model = new EmployeeWorkspaceViewModel();
public IEnumerable<Employee> ViewEmployees = new List<Employee>();
public IList<Employee> selectedEmployees;
public Employee selectedEmployee;
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
ViewEmployees = model.Employees;
selectedEmployees = new List<Employee>() { ViewEmployees.FirstOrDefault() };
selectedEmployee = ViewEmployees.FirstOrDefault();
DialogService.Alert("FOO");
}
private void onEditClicked(Employee employee)
{
Manager.NavigateTo($"employee-view/{employee.Id}");
}
}
As you can see,i'll also try to click on the "Edit" Button to navigate to an other component (Employee-View).
The NavigationManager itself works. if i try to navigate in the OnInitializedAsync to employee-view/1 it works. so after initialize Blazor navigates to localhost:7029/employee-view/1
But nothing happen when the RadzenButton was clicked.
I hope someone can help me to figure out what's going wrong.
Kind regards
Gala
