Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
1 contributor

Users who have contributed to this file

67 lines (56 sloc) 3.33 KB
@page "/dropdown-datagrid"
@using NorthwindBlazor.Data
@using NorthwindBlazor.Models.Northwind
@using Microsoft.EntityFrameworkCore
@inject NorthwindContext dbContext
<h1 style="display:inline">DropDownDataGrid</h1><a style="margin-left: 10px" href="https://github.com/akorchev/blazor.radzen.com/blob/master/Pages/DropDownDataGridPage.razor" target="_blank">[source code]</a><a style="margin-left: 10px" href="https://www.radzen.com/documentation/blazor/dropdown-datagrid/" target="_blank">[documentation]</a>
<p>This page demonstrates <b>DropDownDataGrid</b> component.</p>
<RadzenCard>
<div class="row">
<div class="col-md-6">
<h3>DropDownDataGrid</h3>
<RadzenDropDownDataGrid TValue="string" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" AllowFiltering="true" AllowClear="true" Data="@customers" TextProperty="CompanyName" ValueProperty="CustomerID" Style="margin-bottom: 20px" Change="@(args => Change(args, "DropDown"))" />
<br />
<h3>DropDownDataGrid with placeholder</h3>
<RadzenDropDownDataGrid TValue="string" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" AllowFiltering="true" AllowClear="true" Placeholder="Select..." Data="@customers" TextProperty="CompanyName" ValueProperty="CustomerID" Change="@(args => Change(args, "DropDown with placeholder"))" Style="margin-bottom: 20px" />
<br />
<h3>DropDownDataGrid with template</h3>
<RadzenDropDownDataGrid AllowFiltering="true" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" AllowClear="true" @bind-Value="value" Placeholder="Select..." Data="@customers" TextProperty="CompanyName" ValueProperty="CustomerID"
Change="@(args => Change(args, "DropDown with placeholder"))" Style="margin-bottom: 20px; width:400px;">
<Template>
Company: @((context as Customer).CompanyName)
</Template>
</RadzenDropDownDataGrid>
<br />
<h3>DropDownDataGrid with multiple selection</h3>
<RadzenDropDownDataGrid AllowFiltering="true" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" AllowClear="true" @bind-Value="multipleValues" Multiple="true" Placeholder="Select..." Data="@customers" TextProperty="CompanyName" ValueProperty="CustomerID"
Change="@(args => Change(args, "DropDown with multiple selection"))" Style="margin-bottom: 20px; width:400px;" />
</div>
<div class="col-md-6">
<h3>Events</h3>
<RadzenCard style="overflow: auto;height:500px;">
@foreach (var e in events.OrderByDescending(i => i.Key))
{
@e.Value
<br />
}
</RadzenCard>
</div>
</div>
</RadzenCard>
@code {
IEnumerable<dynamic> customers;
IEnumerable<string> multipleValues;
string value;
protected override async Task OnInitializedAsync()
{
customers = await Task.FromResult(dbContext.Customers);
}
Dictionary<DateTime, string> events = new Dictionary<DateTime, string>();
void Change(object value, string name)
{
var str = value is IEnumerable<object> ? string.Join(", ", (IEnumerable<object>)value) : value;
events.Add(DateTime.Now, $"{name} value changed to {str}");
StateHasChanged();
}
}
You can’t perform that action at this time.