Class FloatLabelType

Specifies the floating label behavior for the placeholder text in the SfMultiColumnComboBox<TValue, TItem> component.

Inheritance

System.Object

FloatLabelType

Namespace: Syncfusion.Blazor.MultiColumnComboBox

Assembly: Syncfusion.Blazor.dll

Syntax

public sealed class FloatLabelType : Enum

Remarks

The floating label feature enhances user experience by providing dynamic placeholder behavior. It helps maintain context about the input field's purpose while allowing users to see their entered values clearly.

Examples

The following example demonstrates how to configure floating labels:

<SfMultiColumnComboBox TValue="string" TItem="Employee" 
                       DataSource="@Employees" 
                       Placeholder="Select an employee"
                       FloatLabelType="FloatLabelType.Auto">
</SfMultiColumnComboBox>

Fields

Always

The placeholder text is always displayed as a floating label above the input field in the SfMultiColumnComboBox<TValue, TItem> component.

Declaration

public const FloatLabelType Always

Field Value

Type
FloatLabelType

Remarks

The label remains visible at all times, positioned above the input field, providing constant context about the field's purpose. This ensures users always know what information is expected in the field.

Auto

The placeholder text floats above the input field when the user focuses on the field or enters text in the SfMultiColumnComboBox<TValue, TItem> component.

Declaration

public const FloatLabelType Auto

Field Value

Type
FloatLabelType

Remarks

This provides an optimal user experience by showing the placeholder normally until interaction begins, then floating it above to maintain context. The label automatically transitions between normal and floating positions based on user interaction and content presence.

Never

The placeholder text remains in its original position and does not float in the SfMultiColumnComboBox<TValue, TItem> component.

Declaration

public const FloatLabelType Never

Field Value

Type
FloatLabelType

Remarks

In this mode, the placeholder text behaves like traditional HTML placeholder text, disappearing when the user starts typing. This provides a familiar, standard input field experience.