Filter by icons

[Pavel]

Hello, I have a grid component with a column consisting of icons. There is some logic for each icon that either displays or hides the icon in the column. I want to be able to filter by these icons, how can that be achieved?

Grid Component

<SfGrid DataSource="@Orders" AllowPaging="true">

 <GridPageSettings PageSize="5"></GridPageSettings>

<GridFilterSettings Type="FilterType.Excel">

</GridFilterSettings>

 <GridTemplates>

    <RowTemplate>

            <td class="@ThemeInfo.Theme">

                <div>

                    <Icons FoodData="@FoodData">

                    </Icons>

                </div>

            </td>

    </RowTemplate>

</GridTemplates>

   <GridColumns>

<GridColumn HeaderText="Icons" MinWidth="800" Width="800" AllowFiltering="true" AllowSorting="false"/>

   </GridColumns>

</SfGrid>

Here is the Icons component

@if (FoodData.HasBurgers)
{
    <SfTooltip WindowCollision="true" CssClass="@ThemeInfo.Theme" OpenDelay="1000" OpensOn="Hover" ID="tooltip" IsSticky="false" Target="#target">
        <TooltipTemplates>
            <Content>
                <div class="@ThemeInfo.Theme">
                    <span>Serves burgers.</span>
                </div>
            </Content>
        </TooltipTemplates>
        <a id="target">
            <i class="bi bi-box-arrow-down"></i>
        </a>
    </SfTooltip>
@if (FoodData.HasShake)
{
    <SfTooltip WindowCollision="true" CssClass="@ThemeInfo.Theme" OpenDelay="1000" OpensOn="Hover" ID="tooltip" IsSticky="false" Target="#target">
        <TooltipTemplates>
            <Content>
                <div class="@ThemeInfo.Theme">
                    <span>Serves Shakes</span>
                </div>
            </Content>
        </TooltipTemplates>
        <a id="target">
            <i class="bi bi-cloud-minus"></i>
        </a>
    </SfTooltip>
}


I want to be able to filter by the icons such as <i class="bi bi-cloud-minus">Thank you

[Sarveswaran Palani]

Hi Pavel,

Greetings from Syncfusion support,

We have analyzed your query and suspect that you want to filter column using icon. We suggest you to use FilterByColumn method to programmatically perform filter action in grid while on icon clicking event. Kindly refer the API reference for your reference. I f you still facing an issue, please share the video demo to us, it'll more helpful to rectify the issue asap.

Refer our API reference: FilterByColumn

Regards,

Sarveswaran PK

[Pavel]

Could you provide a code sample for FilterByColumn? As you can see in the snippet i provided, there is no Field property on the grid column 

[Sarveswaran Palani]

Hi Pavel,

Thanks for contacting Syncfusion support.

We have analyzed your query and we would like to inform you that CRUD operations and data operation will be performed based on field property value. This is the default behavior of the Grid. So, we advised you to assign field property value and enable AllowFiltering as true to perform filtering operation.

Kindly get back to us, if you have any further queries.

Regards,

Sarveswaran PK