Class DropDownListFieldSettings
Represents the field mappings for binding data to the SfDropDownList<TValue, TItem> component.
Inherited Members
Namespace: Syncfusion.Blazor.DropDowns
Assembly: Syncfusion.Blazor.dll
Syntax
public class DropDownListFieldSettings : SfDataBoundComponent
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
public string Disabled { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string representing the field name that indicates whether a list item is disabled. The default value is |
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
public string GroupBy { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string representing the field name for grouping. The default value is |
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" }
};
}
HtmlAttributes
Gets or sets a collection of additional attributes to apply to the popup list element.
Declaration
public string HtmlAttributes { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string containing HTML attributes, such as styles or classes, to apply to the popup list. The default value is |
Remarks
This property allows customization of the popup list element with additional HTML attributes. If both this property and equivalent HTML attributes are configured, the property value takes precedence. Note that this property is marked as obsolete and may not be supported in future versions.
IconCss
Gets or sets the CSS class string to include an icon or image for dropdown list items.
Declaration
public string IconCss { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string containing space-separated CSS classes for icons or images. The default value is |
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
public string Text { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string representing the field name for the text of list items. The default value is |
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
public string Value { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string representing the field name for the value of list items. The default value is |
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" }
};
}