Show clear button in GridForeignColumn

[Erick]

Hello,

In DrowDownList there is an option to show a clear button when the user does not want to select any item in the dropdown list (with ShowClearButton="true" parameter). Is there such an option for a GridForeignColumn?

Thanks,

Erick 

[Jeevakanth Palaniappan]

Hi Erick, 

Greetings from Syncfusion support. 

We have validated your query and you can achieve your requirement by using the EditorSetting of GridColumns. By using this we can able to customize the default dropdown component in the Editform. Please refer the below documentation for your reference. 

https://blazor.syncfusion.com/documentation/datagrid/editing/#dropdownedit  

Regards, 

Jeevakanth SP. 

[Alexander Brouwer]

I know this thread is a little old, but I too have this problem and the link given doesn't help me as I cannot find what Jeevakanth is talking about.  Can you elaborate how this is solved with a better example?

[Alexander Brouwer]

After a bit of trial and error I managed to get it to cooperate.  I hope this example of how to do this may help someone:

 <GridForeignColumn Field=@nameof(ManageUsersView.User.CustomerId)

                                       HeaderText="Customer Link"

                                       Width="150px"

                                       ForeignDataSource="@customersList"

                                       ForeignKeyValue="DisplayName"

                                       ForeignKeyField="Id">

                            <EditTemplate>

                                Customer Link

                                @{

                                <SfDropDownList ID="UserCustomerID" @bind-Value="@((context as ManageUsersView.User).CustomerId)" TItem="Customer" TValue="int?" DataSource="@customersList" ShowClearButton="true">

                                    <DropDownListFieldSettings Value="Id" Text="DisplayName" ></DropDownListFieldSettings>

                                </SfDropDownList>

                                }

                            </EditTemplate>

                        </GridForeignColumn>

[Monisha Saravanan]

Hi Alexander,

Greetings from Syncfusion support.

Query:” I know this thread is a little old, but I too have this problem and the link given doesn't help me as I cannot find what Jeevakanth is talking about.  Can you elaborate how this is solved with a better example?”

Thanks for the detailed explanation on the update. Also we would like to inform that we can also use EditParams to enable the showclearbutton. Kindly check the attached code snippet for your reference.

<SfGrid DataSource="@Orders" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" Height="315">

   

    <GridColumns>

        <GridColumn Field=@nameof(Order.OrderID) IsPrimaryKey="true" HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn>

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

</SfGrid>

 

@code{

    public IEditorSettings EditParams = new DropDownEditCellParams

    {

        Params = new DropDownListModel<object, object>() { AllowFiltering = true, ShowClearButton = true }

    };

}

Reference: https://blazor.syncfusion.com/documentation/datagrid/cell-edit-types#dropdownedit

Kindly get back to us if you have further queries.

Regards,

Monisha