Class DropDownListFieldSettings

Represents the field mappings for binding data to the SfDropDownList<TValue, TItem> component.

Inheritance
object
ComponentBase
OwningComponentBase
SfOwningComponentBase
SfBaseComponent
SfDataBoundComponent
DropDownListFieldSettings
Implements
Inherited Members
Namespace: Syncfusion.Blazor.DropDowns
Assembly: Syncfusion.Blazor.dll
Syntax
public class DropDownListFieldSettings : SfDataBoundComponent, IComponent, IHandleEvent, IHandleAfterRender, IDisposable
Remarks

This class maps properties from the data source to the dropdown list, enabling customization of displayed text, values, grouping, icons, and disabled states.

Examples
<SfDropDownList TValue="string" TItem="Country" Placeholder="Select a country" DataSource="@Countries">
    <DropDownListFieldSettings Text="Name" Value="Code"/>
</SfDropDownList>
@code {
    public class Country
    {
        public string Name { get; set; }
        public string Code { get; set; }
    }
    List<Country> Countries = new List<Country>
    {
        new Country { Name = "Australia", Code = "AU" },
        new Country { Name = "Bermuda", Code = "BM" },
        new Country { Name = "Canada", Code = "CA" }
    };
}

Constructors

DropDownListFieldSettings()

Declaration
public DropDownListFieldSettings()

Properties

Disabled

Gets or sets the field name that determines whether a list item is disabled.

Declaration
[Parameter]
public string Disabled { get; set; }
Property Value
Type Description
string

A string representing the field name that indicates whether a list item is disabled. The default value is String.Empty.
Remarks

This property specifies the data source field that determines whether a list item is disabled. If set, items where this field evaluates to true will be disabled and unselectable in the dropdown list.

Examples
<SfDropDownList TValue="string" TItem="Country" Placeholder="Select a country" DataSource="@Countries">
    <DropDownListFieldSettings Text="Name" Value="Code" Disabled="IsDisabled"/>
</SfDropDownList>
@code {
    public class Country
    {
        public string Name { get; set; }
        public string Code { get; set; }
        public bool IsDisabled { get; set; }
    }
    List<Country> Countries = new List<Country>
    {
        new Country { Name = "Australia", Code = "AU", IsDisabled = false },
        new Country { Name = "Bermuda", Code = "BM", IsDisabled = true },
        new Country { Name = "Canada", Code = "CA", IsDisabled = false }
    };
}

GroupBy

Gets or sets the field name used to group list items in the dropdown.

Declaration
[Parameter]
public string GroupBy { get; set; }
Property Value
Type Description
string

A string representing the field name for grouping. The default value is String.Empty.
Remarks

When set, this property groups list items in the dropdown popup based on the specified field, enhancing the organization and readability of the list.

Examples
<SfDropDownList TValue="string" TItem="Vegetables" Placeholder="Select a vegetable" DataSource="@VegetablesList">
    <DropDownListFieldSettings Text="Name" Value="ID" GroupBy="Category"/>
</SfDropDownList>
@code {
    public class Vegetables
    {
        public string ID { get; set; }
        public string Name { get; set; }
        public string Category { get; set; }
    }
    List<Vegetables> VegetablesList = new List<Vegetables>
    {
        new Vegetables { Name = "Cabbage", Category = "Leafy and Salad", ID = "item1" },
        new Vegetables { Name = "Chickpea", Category = "Beans", ID = "item2" },
        new Vegetables { Name = "Green bean", Category = "Beans", ID = "item4" },
        new Vegetables { Name = "Spinach", Category = "Leafy and Salad", ID = "item9" }
    };
}

IconCss

Gets or sets the CSS class string to include an icon or image for dropdown list items.

Declaration
[Parameter]
public string IconCss { get; set; }
Property Value
Type Description
string

A string containing space-separated CSS classes for icons or images. The default value is String.Empty.
Remarks

This property allows adding icons or images to dropdown list items by specifying CSS classes, enhancing the visual representation of each item.

Examples
<SfDropDownList TValue="string" TItem="Country" Placeholder="Select a country" DataSource="@Countries">
    <DropDownListFieldSettings Text="Name" Value="Code" IconCss="flag-icon"/>
</SfDropDownList>
@code {
    public class Country
    {
        public string Name { get; set; }
        public string Code { get; set; }
    }
    List<Country> Countries = new List<Country>
    {
        new Country { Name = "Australia", Code = "AU" },
        new Country { Name = "Bermuda", Code = "BM" },
        new Country { Name = "Canada", Code = "CA" }
    };
}

Text

Gets or sets the field name that maps the text field from the data source for each list item.

Declaration
[Parameter]
public string Text { get; set; }
Property Value
Type Description
string

A string representing the field name for the text of list items. The default value is String.Empty.
Remarks

This property specifies the data source field to display as the text for each dropdown list item. If not set, the list items will display empty text, which may result in an empty popup.

Examples
<SfDropDownList TValue="string" TItem="Country" Placeholder="Select a country" DataSource="@Countries">
    <DropDownListFieldSettings Text="Name" Value="Code"/>
</SfDropDownList>
@code {
    public class Country
    {
        public string Name { get; set; }
        public string Code { get; set; }
    }
    List<Country> Countries = new List<Country>
    {
        new Country { Name = "Australia", Code = "AU" },
        new Country { Name = "Bermuda", Code = "BM" },
        new Country { Name = "Canada", Code = "CA" }
    };
}

Value

Gets or sets the field name that maps the value field from the data source for each list item.

Declaration
[Parameter]
public string Value { get; set; }
Property Value
Type Description
string

A string representing the field name for the value of list items. The default value is String.Empty.
Remarks

This property specifies the data source field to use as the value for each dropdown list item. If not set, the dropdown list may display an empty popup, as the value mapping is critical for selection functionality.

Examples
<SfDropDownList TValue="string" TItem="Country" Placeholder="Select a country" DataSource="@Countries">
    <DropDownListFieldSettings Text="Name" Value="Code"/>
</SfDropDownList>
@code {
    public class Country
    {
        public string Name { get; set; }
        public string Code { get; set; }
    }
    List<Country> Countries = new List<Country>
    {
        new Country { Name = "Australia", Code = "AU" },
        new Country { Name = "Bermuda", Code = "BM" },
        new Country { Name = "Canada", Code = "CA" }
    };
}

Implements