How to Bind a List to a DropDown Column

[Ricardo Martinez]

I am trying to bind a List of items from memory to a Column on a Grid but the items don't appear:

 <EjsGrid ModelType="@Model" DataSource="@lstEmpleados" AllowPaging="false" AllowSorting="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" Height="315">
            <GridEditSettings Mode="@EditMode.Normal" AllowAdding="true" AllowEditing="true" AllowDeleting="true"></GridEditSettings>
            <GridEvents OnActionComplete="ActionComplete" TValue="ModelEmpleado"></GridEvents>
            <GridColumns>
                <GridColumn Field=@nameof(ModelEmpleado.EmpleadoID) HeaderText="Empleado ID" IsPrimaryKey="true" Width="80"></GridColumn>
                <GridColumn Field=@nameof(ModelEmpleado.Nombre) HeaderText="Nombre" Width="120"></GridColumn>
                <GridColumn Field=@nameof(ModelEmpleado.Apellido) HeaderText="Apellido" Width="120"></GridColumn>
                <GridColumn Field=@nameof(ModelEmpleado.NombrePais) HeaderText="País" EditType="EditType.DropDownEdit"
                            ForeignKeyField="NombrePais" ForeignKeyValue="NombrePais" DataSource="@lstPaises" Width="120">
                </GridColumn>
            
            </GridColumns>
        </EjsGrid>

@code {

    public ModelEmpleado Model = new ModelEmpleado();

    public List<clsPais> lstPaises { set; get; }

 protected override async Task OnInitializedAsync()
    {

       
        lstPaises =  new List<clsPais>() ;

      lstPaises.Add(new clsPais(){ NombrePais="GUATEMALA", CodigoPais=502};

      lstPaises.Add(new clsPais(){ NombrePais="EL SALVADOR", CodigoPais=503};

    }

}

public class ModelEmpleado

{

 public string EmpleadoID { set; get; }

 public string NombrePais { set; get; }

public string Nombre { get; set; }
        public string Apellido { get; set; }

}

Thanks

[Vignesh Natarajan]

Hi Ricardo,  

 

Greetings from Syncfusion support.  

 

Query: “I am trying to bind a List of items from memory to a Column on a Grid but the items don't appear” 

 

From above query, we suspect that you are facing issue while binding data to DropDownList for the Foreignkey column. We have prepared a sample using your code example and we are not able to reproduce the reported issue at our end. The reported issue might occur when foreignkey column does not match with the column Field value.  So kindly ensure that you column dataSource value matches with foreignkey column’s Field data.  

 

Kindly the sample which we have prepared using your code example from below  

 

Sample: https://www.syncfusion.com/downloads/support/forum/148114/ze/BlazorApp1-1255022435  

 

Also refer our UG documentation for your reference 

 

https://ej2.syncfusion.com/blazor/documentation/grid/columns/#foreign-key-column  

 

After referring the sample, if you still have queries kindly get back to us with following details.  

 

1. Share the Video demonstration of the reported issue.
2. Are you facing the above issue while displaying the data in Grid column or Dropdownlist inside the column?.
3. We have analyzed the provided code example and found that you have used same property (NombrePais) in all three properties Field, ForeignKeyField and ForeignKeyValue of GridColumn. There is no need for ForeignKeyColumn while using the above architecture. So can you please explain your scenario in detail.
4. If possible try to reproduce the reported issue in provided sample.
5. Share your Syncfusion Nuget package version and corresponding script files version.

 

Requested details will be helpful for us to validate the reported issue at our end and provide solution as soon as possible. 

 

Regards, 

Vignesh Natarajan.