SFGrid with a dropdownlist

[Mehdi]

Hi

i'm new to SF and i cannot use a dropdown within a grid

I do not get how to use the  @bind-Value="@((context as PaymentDetail).PaymentProject)">

          If I use the commented line of code I can display the default value and the dropdown with my list but when I select it, it is not in the grid, the default value is still displayed. I can catch the new value in the OnChange though

Here is my code

   <SfGrid @ref="paymentdetailsGrid"

                                        TValue="PaymentDetail"

                                        Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })"

                                        Height="315"

                                        DataSource="@paymentDetailList"

                                        Query="@(new Syncfusion.Blazor.Data.Query().Where("PaymentId", "equal", SelectedPaymentId))"

                                        >

                                    <GridEditSettings AllowAdding="true"

                                                      AllowEditing="true"

                                                      AllowDeleting="true"

                                                      Mode="EditMode.Batch"

                                                      >

                                    </GridEditSettings>

                                 <GridEvents TValue="PaymentDetail"

                                             OnBatchSave="OnBatchSavePaymentDetail" 

                                             >

                                 </GridEvents>

                                    <GridColumns>

                                        <GridColumn Field=@nameof(PaymentDetail.PaymentDetailId) HeaderText="Id" Width="20" IsPrimaryKey="true" IsIdentity="true" />

                                        <GridColumn Field=@nameof(PaymentDetail.PaymentProject) HeaderText="Project" EditType="EditType.DropDownEdit" Width="110">

                                            <EditTemplate Context="pdp">

                                                <SfDropDownList ID="PaymentProject" Placeholder="Select a project" TItem="Project" TValue="string"

                                                                DataSource="@projectList"

                                                                @bind-Value="@((context as PaymentDetail).PaymentProject)">

                                                    @*@bind-Value="@payment.PaymentDetails.Where(x => x.PaymentId == SelectedPaymentId).FirstOrDefault().PaymentProject"*@

                                                    <DropDownListEvents TItem="Project" TValue="string" ValueChange="ValueChange"></DropDownListEvents>

                                                    <DropDownListFieldSettings Text="ProjectName" Value="ProjectName"></DropDownListFieldSettings>

                                                </SfDropDownList>

                                            </EditTemplate>

                                        </GridColumn>

                                        <GridColumn Field=@nameof(PaymentDetail.Amount) HeaderText="Amount" Width="40" Type="ColumnType.Number" />

                                    </GridColumns>

                                </SfGrid>

Upfront thanks

Attachment: new_1_32dcfa93.zip

[Mehdi]

Hi all

I did not notive but i should have written 

Value="@((context as PaymentDetail).PaymentProject)">

instead of 

@bind-Value="@((context as PaymentDetail).PaymentProject)">

However this does not work better

I still have the following error

Error CS0039 Cannot convert type 'Microsoft.AspNetCore.Components.Forms.EditContext' to 'Shared.Models.PaymentDetail' via a reference conversion, boxing conversion, unboxing conversion, wrapping conversion, or null type conversion

[Jeevakanth Palaniappan]

Hi Mehdi, 

Greetings from Syncfusion support. 

We have validated your query but we are unable to reproduce the reported problem when rendering the dropdown in the EditTemplate. By default we will handle the editing action by using the @bind-Value property for which the value present in the datasource has to be provided without customizing it. If you are using @Value property then you have to handle the editing by using the OnCellSave event of the grid.  

We have created a sample for both the scenario(@bind-Value – Index.razor, @Value – Counter.razor). 

Sample -  https://www.syncfusion.com/downloads/support/directtrac/general/ze/DataGrid-180047184 

Documentation : https://blazor.syncfusion.com/documentation/datagrid/editing/#cell-edit-template 

If you are still facing any issue then kindly share us the below details. 

1. Share us the Syncfusion NuGet version.
2. Share us the issue reproducing sample or reproduce the issue in the provided sample.

Regards, 

Jeevakanth SP. 

[Mehdi]

Hello

your sample works like a charm

Unfortunately on my side i still have the issue with the context. 

I am using 18.4.0.48, VS2019, MSSQL DB

You can find attached my code but without the db it will not run

Any help would be much appreciated

[Mehdi]

It seems that i was missing the declaration of the dropdownlist

Then i had to clean everything i tried to make the code ok

[Jeevakanth Palaniappan]

Hi Mehdi, 

We are glad that you have resolved your issue. Please get back to us if you have any other queries. 

Regards, 

Jeevakanth SP.

[Mehdi]

Dear support

would you mind giving me a sample with a grid or orders that contains a dropdownlist of another object : customer, product from another entity

I am trying to display in the dropdown the data from another table in the database but i keep getting Object reference not set to an instance of an object

I do not get what could be null

Upfront thx

[Jeevakanth Palaniappan]

Hi Mehdi, 

We have checked your code and found that you have provided grid and dropdown with different models. So based on your scenario we suggest you to use the GridForeignColumn. Please refer the below code snippet, documentation and the sample for your reference. 

        <GridForeignColumn Field=@nameof(Order.EmployeeID) HeaderText="Employee Name" ForeignKeyValue="FirstName" ForeignDataSource="@Employees" Width="150"> 

            <EditTemplate> 

                <SfDropDownList ID="EmployeeID" @bind-Value="@((context as Order).EmployeeID)" TItem="EmployeeData" TValue="int?" DataSource="Employees"> 

                    <DropDownListFieldSettings Text="FirstName" Value="EmployeeID"></DropDownListFieldSettings> 

                </SfDropDownList> 

            </EditTemplate> 

        </GridForeignColumn> 

Sample -  https://www.syncfusion.com/downloads/support/directtrac/general/ze/DataGrid-1674616955 

Documentation: 

https://blazor.syncfusion.com/documentation/datagrid/columns/#foreign-key-column---local-data 

Please get back to us if you have any other queries. 

Regards, 

Jeevakanth SP. 

[Mehdi]

Thank you for this support

[Jeevakanth Palaniappan]

Hi Mehdi, 

Thanks for the update. Please get back to us if you have any other queries. 

Regards, 

Jeevakanth SP.