Using DataSource property of Grid Column to show DropDown list in editing
Good day,
I have a GridColumn in which I want to show a simple drop-down list that contains two values i.e. "In progress" and "Completed". I have used the EditType.DropDown property and during editing a drop-down appears as well but it is empty with no text. I have used the DataSource property in GridColumn but the text is not being displayed. How can I display the text dropdown?
It is to be noted here that I am using WebApiAdaptor with EjsDataManager to display and perform CRUD operations on data.
<EjsGrid TValue="Projekte" AllowPaging="true" AllowFiltering="true" AllowSorting="true" Toolbar="@(new List() { " Add", "Edit", "Delete", "Cancel", "Update" })">
<EjsDataManager Url="/Api/Default" Adaptor="Adaptors.WebApiAdaptor">EjsDataManager>
<GridEditSettings AllowAdding="true" AllowDeleting="true" AllowEditing="true" Mode="EditMode.Normal">GridEditSettings>
<GridColumns>
<GridColumn Field=@nameof(Projekte.Id) AllowEditing="false"HeaderText="ID" TextAlign="TextAlign.Right">GridColumn>
<GridColumn Field=@nameof(Projekte.Status) HeaderText="Status" EditType="EditType.DropDownEdit" TextAlign="TextAlign.Right"
DataSource="@status"> GridColumn>
GridColumns>
EjsGrid>
@code{
public List<string> status { set; get; }
protected override void OnInitialized()
{
status = new List<string>{"In Process","Completed"};
}
}
P.S. I have tried using the Template inside the grid column (as shown here: https://www.syncfusion.com/forums/149233/syncfusion-blazor-binding-drop-down-list-in-grid-column) but it gives me an error.
Error
The child content element 'Template' of component 'GridColumn' uses the same parameter name ('context') as enclosing child content element 'Authorized' of component 'AuthorizeView'. Specify the parameter name like: ' to resolve the ambiguity.
I have added the ModelType attribute to the EjsGrid tag as well but the error doesn't go away. Please help.
Thanks in advance.
SIGN IN To post a reply.
1 Reply
RS
Renjith Singh Rajendran
Syncfusion Team
November 25, 2019 01:04 PM UTC
Hi Junaid,
Thanks for contacting Syncfusion support.
We suggest you to use the Edit params feature of Grid. Provide the data for DropDownList by using the DataSource property of DropDownList. Also ensure to set the Fields property with respect to the Grid column’s Field. Please refer the documentation link below,
Documentation : https://ej2.syncfusion.com/blazor/documentation/grid/editing/?no-cache=1#cell-edit-type-and-its-params
Please use the code below,
|
<EjsGrid TValue="Order" ...>
...
<GridColumns>
<GridColumn Field=@nameof(Order.OrderID) AllowEditing="false" HeaderText="ID" TextAlign="TextAlign.Right"></GridColumn>
<GridColumn Field=@nameof(Order.CustomerID) HeaderText="Status" EditType="EditType.DropDownEdit"...Edit="@CustomerIDEditParams">
</GridColumn>
</GridColumns>
</EjsGrid>
@code{
...
public static List<Country> status {get;set;}
protected override void OnInitialized()
{
status = new List<Country> {new Country() { CustomerID= "In Process" },new Country() { CustomerID= "Completed"}};
}
public class Country
{
public string CustomerID { get; set; }
}
public object CustomerIDEditParams = new
{
@@params = new EjsDropDownList<string>() { DataSource = status, Fields = new DropDownListFieldSettings() { Text = "CustomerID", Value = "CustomerID" } }
};
...
}
|
Please get back to us if you need further assistance.
Regards,
Renjith Singh Rajendran.
SIGN IN To post a reply.
- 1 Reply
- 2 Participants
-
JU Junaid
- Nov 23, 2019 11:55 AM UTC
- Nov 25, 2019 01:04 PM UTC