Class ListBoxTemplates<TItem>

Provides template customization options for item and empty-state visual representation in a SfListBox<TValue, TItem>.

Inheritance

System.Object

ListBoxTemplates<TItem>

Namespace: Syncfusion.Blazor.DropDowns

Assembly: Syncfusion.Blazor.dll

Syntax

public class ListBoxTemplates<TItem> : OwningComponentBase

Type Parameters

Name	Description
TItem	The type of data modeled for each ListBox item (typically your item POCO).

Remarks

Use this class to supply custom markup or UI design for each item row (via ItemTemplate) and for the case when no data records are present (NoRecordsTemplate).

Constructors

ListBoxTemplates()

Declaration

public ListBoxTemplates()

Properties

ItemTemplate

Gets or sets the template used for rendering each item in the SfListBox<TValue, TItem>. Set this to create a custom layout or appearance for item rows.

Declaration

public RenderFragment<TItem> ItemTemplate { get; set; }

Property Value

Type
Microsoft.AspNetCore.Components.RenderFragment<TItem>

Remarks

Implement this template to style, reformat, or include additional content for every row of the ListBox. TItem supplies your bound data model (as the context).

Examples

This example creates an item template displaying a custom property:

<SfListBox Value="@value" DataSource="@vehicleData" TValue="string[]" TItem="ListItem">
    <ListBoxFieldSettings Text="Text" Value="ID"></ListBoxFieldSettings>
    <ListBoxTemplates TItem="ListItem">
        <ItemTemplate>
            <div class="list-wrapper">
               <span class="text">@((context as ListItem).Text)</span>
           </div>
       </ItemTemplate>
   </ListBoxTemplates>
</SfListBox>

NoRecordsTemplate

Gets or sets the template that is displayed in the ListBox when no records are found. Use to customize the "no results found" UI.

Declaration

public RenderFragment NoRecordsTemplate { get; set; }

Property Value

Type
Microsoft.AspNetCore.Components.RenderFragment

Remarks

Useful for scenarios where you wish to display user guidance or custom messages when the ListBox data set is empty or a search/filter yields no results.

Examples

This example creates a customized "No Records" message:

<SfListBox Value="@value" DataSource="@vehicleData" TValue="string[]" TItem="ListItem">
    <ListBoxFieldSettings Text="Text" Value="ID"></ListBoxFieldSettings>
    <ListBoxTemplates TItem="ListItem">
        <NoRecordsTemplate>
            <div class="no-rec-template">
               <span class="text">No Records Found</span>
           </div>
       </NoRecordsTemplate>
   </ListBoxTemplates>
</SfListBox>

Methods

Dispose(Boolean)

Declaration

protected override void Dispose(bool disposing)

Parameters

Type	Name	Description
System.Boolean	disposing

OnInitializedAsync()

Declaration

protected override Task OnInitializedAsync()

Returns

Type
System.Threading.Tasks.Task