I'm trying to make a selectable dropdown list as a column, but when I do so it does not appear to update the grid value column.
I'm also open to different implementations of this. I've tried to get this to work as a GridForeignColumn using a DataManager, but was unable to find the proper syntax.
Below is a copy of my attempt to work with this from an example found on the Syncfusion website. This includes the Microsoft.AspNetCore.Blazor.HttpClient package to make the Http.GetAsync() to work.
@page "/"
@using Syncfusion.EJ2.Blazor.DropDowns;
@using Syncfusion.EJ2.Blazor.Data;
@using Syncfusion.EJ2.Blazor.Grids
@using System.Net.Http
@using System.Xml.Linq
@using System
@inject HttpClient Http
<EjsGrid DataSource="@Orders" Height="250" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })">
<GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="EditMode.Normal"></GridEditSettings>
<GridColumns>
<GridColumn Field=@nameof(Order.OrderID) IsPrimaryKey="true" HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn>
<GridColumn Field=@nameof(Order.EmployeeID) HeaderText="Employee Name" ForeignKeyValue="FirstName" ForeignKeyField="EmployeeID" Width="150" DataSource="Employees">
<EditTemplate>
<EjsDropDownList TValue="int?" TItem="EmployeeData" DataSource="Employees">
<DropDownListFieldSettings Text="FirstName" Value="EmployeeID"></DropDownListFieldSettings>
</EjsDropDownList>
</EditTemplate>
</GridColumn>
<GridColumn Field=@nameof(Order.OrderDate) HeaderText="Order Date" Format="d" Type="ColumnType.Date" TextAlign="TextAlign.Right" Width="130"></GridColumn>
<GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn>
</GridColumns>
</EjsGrid>
@code{
public List<Order> Orders { get; set; }
public List<EmployeeData> Employees { get; set; }
protected override void OnInitialized()
{
Orders = Enumerable.Range(1, 75).Select(x => new Order()
{
OrderID = 1000 + x,
EmployeeID = x,
Freight = 2.1 * x,
OrderDate = DateTime.Now.AddDays(-x),
}).ToList();
var response = Http.GetAsync("https://js.syncfusion.com/demos/ejServices/Wcf/Northwind.svc/Employees").Result;
var xml = StripNameSpaces(XElement.Parse(response.Content.ReadAsStringAsync().Result));
Employees = xml.Descendants("properties")
.Select(employee => new EmployeeData
{
EmployeeID = Convert.ToInt32(employee.Element("EmployeeID").Value),
FirstName = employee.Element("FirstName").Value
})
.ToList();
}
public class Order
{
public int? OrderID { get; set; }
public int? EmployeeID { get; set; }
public DateTime? OrderDate { get; set; }
public double? Freight { get; set; }
}
public class EmployeeData
{
public int? EmployeeID { get; set; }
public string FirstName { get; set; }
}
private XElement StripNameSpaces(XElement xml)
{
return new XElement(
xml.Name.LocalName,
xml.HasElements ?
xml.Elements().Select(element => StripNameSpaces(element)) :
(object)xml.Value);
}
}
