Class SfInputTextBase<TValue>
The SfInputBase is an input element that allows to get input from the user. It allows the user to edit or display the text value.
Inheritance
Inherited Members
Namespace: Syncfusion.Blazor.Inputs
Assembly: Syncfusion.Blazor.dll
Syntax
public abstract class SfInputTextBase<TValue> : SfBaseComponent
Type Parameters
Name | Description |
---|---|
TValue | The type of the value that the input component will handle. |
Remarks
This abstract class provides the foundational functionality for text-based input components in the Syncfusion Blazor suite. It handles common input operations such as validation, floating labels, clear button functionality, and accessibility features.
Constructors
SfInputTextBase()
Declaration
protected SfInputTextBase()
Fields
APPEND
Declaration
protected const string APPEND = "append"
Field Value
Type |
---|
System.String |
APPEND_ICON
Declaration
protected const string APPEND_ICON = "e-append"
Field Value
Type |
---|
System.String |
ARIA_DISABLED
Declaration
protected const string ARIA_DISABLED = "aria-disabled"
Field Value
Type |
---|
System.String |
CLEAR_ICON_HIDE
Declaration
protected const string CLEAR_ICON_HIDE = "e-clear-icon e-clear-icon-hide"
Field Value
Type |
---|
System.String |
CLEARICONHIDE
Declaration
protected const string CLEARICONHIDE = "e-clear-icon-hide"
Field Value
Type |
---|
System.String |
CONTROL_CONTAINER
Declaration
protected const string CONTROL_CONTAINER = "e-control-container"
Field Value
Type |
---|
System.String |
CONTROL_OLD_CONTAINER
Declaration
protected const string CONTROL_OLD_CONTAINER = "e-control-wrapper"
Field Value
Type |
---|
System.String |
DECREMENT
Declaration
protected const string DECREMENT = "Decrement value"
Field Value
Type |
---|
System.String |
DECREMENT_TITLE
Declaration
protected const string DECREMENT_TITLE = "NumericTextBox_DecrementTitle"
Field Value
Type |
---|
System.String |
DISABLE
Declaration
protected const string DISABLE = "e-disabled"
Field Value
Type |
---|
System.String |
DISABLE_ICON
Declaration
protected const string DISABLE_ICON = "e-ddl-disable-icon"
Field Value
Type |
---|
System.String |
DISABLED_ATTR
Declaration
protected const string DISABLED_ATTR = "disabled"
Field Value
Type |
---|
System.String |
FLOATINPUT
Declaration
protected const string FLOATINPUT = "e-float-input"
Field Value
Type |
---|
System.String |
FLOATLABELBOTTOM
Declaration
protected const string FLOATLABELBOTTOM = "e-label-bottom"
Field Value
Type |
---|
System.String |
FLOATLABELTOP
Declaration
protected const string FLOATLABELTOP = "e-label-top"
Field Value
Type |
---|
System.String |
FLOATTEXT
Declaration
protected const string FLOATTEXT = "e-float-text"
Field Value
Type |
---|
System.String |
GROUP_ICON
Declaration
protected const string GROUP_ICON = "e-input-group-icon"
Field Value
Type |
---|
System.String |
INCREMENT
Declaration
protected const string INCREMENT = "Increment value"
Field Value
Type |
---|
System.String |
INCREMENT_TITLE
Declaration
protected const string INCREMENT_TITLE = "NumericTextBox_IncrementTitle"
Field Value
Type |
---|
System.String |
INPUT
Declaration
protected const string INPUT = "e-input"
Field Value
Type |
---|
System.String |
INPUTFOCUS
Declaration
protected const string INPUTFOCUS = "e-input-focus"
Field Value
Type |
---|
System.String |
INPUTGROUP
Declaration
protected const string INPUTGROUP = "e-input-group"
Field Value
Type |
---|
System.String |
MULTILINE
Declaration
protected const string MULTILINE = "e-multi-line-input"
Field Value
Type |
---|
System.String |
PREPEND
Declaration
protected const string PREPEND = "prepend"
Field Value
Type |
---|
System.String |
PREPEND_ICON
Declaration
protected const string PREPEND_ICON = "e-prepend"
Field Value
Type |
---|
System.String |
SPACE
Declaration
protected const string SPACE = " "
Field Value
Type |
---|
System.String |
SPIN_DOWN
Declaration
protected const string SPIN_DOWN = "e-spin-down"
Field Value
Type |
---|
System.String |
SPIN_UP
Declaration
protected const string SPIN_UP = "e-spin-up"
Field Value
Type |
---|
System.String |
Properties
_value
Gets or sets the internal backing field for the component's value.
Declaration
protected TValue _value { get; set; }
Property Value
Type | Description |
---|---|
TValue | A nullable value of type |
Remarks
This field is used internally to track value changes and should not be accessed directly from external code.
BaseAutocomplete
Gets or sets the autocomplete behavior for the input component.
Declaration
protected virtual string BaseAutocomplete { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string representing the autocomplete attribute value. The default value is "off". |
Remarks
This property controls how browsers handle autocomplete functionality for the input field. Common values include "off" (disable autocomplete), "on" (enable autocomplete), or specific autocomplete tokens like "email", "name", etc.
BaseFloatLabelType
Gets or sets the floating label behavior of the input component that determines how the placeholder text is displayed.
Declaration
protected virtual FloatLabelType BaseFloatLabelType { get; set; }
Property Value
Type | Description |
---|---|
FloatLabelType | A FloatLabelType enumeration value that specifies the floating label behavior. The default value depends on the specific input component implementation. |
Remarks
The floating label behavior controls how the placeholder text is presented to the user:
- NeverThe label never floats and remains as a standard placeholder text within the input field.
- AlwaysThe label is always positioned above the input field, providing a consistent visual layout.
- AutoThe label dynamically floats above the input field when the component receives focus or contains a value, creating an animated transition effect.
BaseHtmlAttributes
Gets or sets additional HTML attributes to be applied to the input component's container element.
Declaration
protected virtual Dictionary<string, object> BaseHtmlAttributes { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.Generic.Dictionary<System.String, System.Object> | A System.Collections.Generic.Dictionary<, > containing key-value pairs of HTML attributes, or |
Remarks
Use this property to add custom HTML attributes such as data attributes, accessibility attributes, or styling classes to the component's container. Common attributes like 'class', 'style', and 'title' are handled specially and may be applied to different elements within the component structure.
BaseInputAttributes
Gets or sets additional HTML attributes to be applied specifically to the input element itself.
Declaration
protected virtual Dictionary<string, object> BaseInputAttributes { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.Generic.Dictionary<System.String, System.Object> | A System.Collections.Generic.Dictionary<, > containing key-value pairs of HTML attributes. The default value is an empty dictionary. |
Remarks
This property allows direct customization of the underlying input element with additional HTML attributes. Attributes set here will be applied directly to the input tag, enabling fine-grained control over input behavior and appearance.
BaseIsReadOnlyInput
Gets or sets a value indicating whether the input element itself should be marked as read-only.
Declaration
protected virtual bool BaseIsReadOnlyInput { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
Remarks
This property specifically controls the read-only attribute on the underlying HTML input element, which may behave differently from the component-level BaseReadonly property.
BasePlaceholder
Gets or sets the placeholder text displayed in the input when no value is present.
Declaration
protected virtual string BasePlaceholder { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string representing the placeholder text, or |
Remarks
The placeholder provides a hint to users about the expected input format or content. This text is automatically hidden when the input receives focus or contains a value.
BaseReadonly
Gets or sets a value indicating whether the input component is in read-only mode.
Declaration
protected virtual bool BaseReadonly { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
Remarks
When in read-only mode, users can view and select the content but cannot modify it. The input will still receive focus and trigger events, but user input will be prevented.
BaseShowClearButton
Gets or sets a value indicating whether a clear button should be displayed to allow users to quickly clear the input value.
Declaration
protected virtual bool BaseShowClearButton { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
Remarks
When enabled, a clear button appears within the input field when it contains a value, allowing users to quickly clear the content. The button is automatically hidden when the input is empty, disabled, or read-only.
BaseTabIndex
Gets or sets the tab index of the input component for keyboard navigation.
Declaration
protected virtual int BaseTabIndex { get; set; }
Property Value
Type | Description |
---|---|
System.Int32 | An integer representing the tab order. Positive values indicate the explicit tab order, 0 means the element is focusable in document order, and negative values remove the element from tab navigation. |
Remarks
This property controls the order in which the component receives focus during keyboard navigation. When the component is disabled, the tab index is automatically set to -1 to remove it from the tab sequence.
BaseWidth
Gets or sets the width of the input component.
Declaration
protected virtual string BaseWidth { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string representing the width in CSS units (e.g., "100px", "50%"), or |
Remarks
This property accepts any valid CSS width value including pixels, percentages, em units, etc. The width is applied to the component's container element to control the overall size.
ClearElement
Gets or sets the element reference to the clear button element.
Declaration
protected ElementReference ClearElement { get; set; }
Property Value
Type | Description |
---|---|
Microsoft.AspNetCore.Components.ElementReference | An Microsoft.AspNetCore.Components.ElementReference pointing to the clear button DOM element. |
Remarks
This reference enables direct interaction with the clear button element for event handling and DOM manipulation.
ComponentReference
Gets or sets a reference identifier used to distinguish this component instance from others.
Declaration
protected virtual string ComponentReference { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string that uniquely identifies this component instance, or |
Remarks
This property is used internally to manage component lifecycle and distinguish between different instances of the same component type, particularly during initialization and script module loading.
ContainerAttr
Gets or sets the HTML attributes to be applied to the input component's container element.
Declaration
protected Dictionary<string, object> ContainerAttr { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.Generic.Dictionary<System.String, System.Object> | A System.Collections.Generic.Dictionary<, > containing key-value pairs of HTML attributes. The default value is an empty dictionary. |
Remarks
This dictionary contains attributes that will be applied to the main container element of the input component. It is used internally to manage container-level styling, accessibility attributes, and other HTML properties.
containerAttributes
Gets or sets the list of HTML attribute names that should be applied to the container element rather than the input element.
Declaration
protected List<string> containerAttributes { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.Generic.List<System.String> | A System.Collections.Generic.List<> containing attribute names. The default value includes "title", "style", and "class". |
Remarks
This list is used during attribute processing to determine which custom attributes should be applied to the container versus the input element, ensuring proper HTML structure and styling inheritance.
CssClass
Gets or sets a CSS class string to customize the appearance of the component.
Declaration
public string CssClass { get; set; }
Property Value
Type | Description |
---|---|
System.String | Accepts a CSS class string separated by space to customize the appearance. The default value is |
DataId
Gets or sets the data identifier used for internal component operations and event handling.
Declaration
protected string DataId { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string representing the data identifier, or |
Remarks
This property is used internally for component identification in JavaScript interop operations and for associating DOM elements with their corresponding component instances.
DecrementTitle
Gets or sets the tooltip text for the decrement button in numeric input components.
Declaration
protected string DecrementTitle { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string containing the localized tooltip text for the decrement button, or |
Remarks
This property holds the localized tooltip text displayed when users hover over the decrement spinner button, enhancing accessibility and user experience.
Enabled
Gets or sets a value that indicates whether to enable or disable the component.
Declaration
public bool Enabled { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
EnablePersistence
Gets or sets whether to persist component's state between page reloads. When set to true
, the Value property is persisted.
Declaration
public bool EnablePersistence { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
Remarks
Component's Value property will be stored in browser local storage to persist component's state when page reloads.
EnableRtl
Gets or sets whether the right-to-left direction is enabled or not for the component.
Declaration
public bool EnableRtl { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
FloatLabel
Gets or sets the CSS class string applied to the floating label element.
Declaration
protected string FloatLabel { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string containing CSS classes that control the floating label's appearance and position. |
Remarks
This property manages the CSS classes that control floating label animations and positioning, including classes for top/bottom positioning and transition effects.
ID
Gets or sets the ID of the component.
Declaration
public string ID { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string representing the identifier of the component. |
Remarks
The ID property allows you to uniquely identify the component in the rendered HTML markup. If you don't set a custom ID, the component's ID will be auto-generated, and it may not be as descriptive as you require.
IncrementTitle
Gets or sets the tooltip text for the increment button in numeric input components.
Declaration
protected string IncrementTitle { get; set; }
Property Value
Type | Description |
---|---|
System.String | A string containing the localized tooltip text for the increment button, or |
Remarks
This property holds the localized tooltip text displayed when users hover over the increment spinner button, enhancing accessibility and user experience.
inputAttr
Gets or sets the collection of HTML attributes to be applied to the input element.
Declaration
protected Dictionary<string, object> inputAttr { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.Generic.Dictionary<System.String, System.Object> | A System.Collections.Generic.Dictionary<, > containing HTML attribute key-value pairs. The default value is an empty dictionary. |
Remarks
This dictionary is used internally to manage all HTML attributes that will be rendered on the input element, including dynamically calculated attributes for styling, accessibility, and behavior.
InputEditContext
Gets or sets the edit context used for form validation and field identification.
Declaration
protected EditContext InputEditContext { get; set; }
Property Value
Type | Description |
---|---|
Microsoft.AspNetCore.Components.Forms.EditContext | An Microsoft.AspNetCore.Components.Forms.EditContext instance that provides validation context for the input component. |
Remarks
This cascading parameter is automatically provided by parent form components such as EditForm. It enables integration with Blazor's built-in validation system.
IsClearButtonClicked
Gets or sets a value indicating whether the clear button was recently clicked.
Declaration
protected bool IsClearButtonClicked { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
Remarks
This flag is used internally to track clear button interactions and coordinate the clearing operation with other component behaviors and event handling.
IsFocused
Gets or sets a value indicating whether the input component currently has focus.
Declaration
protected bool IsFocused { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
Remarks
This property tracks the focus state of the component and is used to manage focus-dependent behaviors such as floating label animations, clear button visibility, and styling updates.
ListOfButtons
Gets or sets the collection of button groups associated with the input component.
Declaration
protected List<SfInputTextBase<TValue>.ButtonGroups> ListOfButtons { get; set; }
Property Value
Type | Description |
---|---|
System.Collections.Generic.List<SfInputTextBase.ButtonGroups<>> | A System.Collections.Generic.List<> containing button configuration objects, or |
Remarks
This property maintains a list of button configurations that can be added to the input component, such as clear buttons, dropdown buttons, or custom action buttons with their respective icons and event handlers.
MultilineInput
Gets or sets a value indicating whether the input component supports multiple lines of text.
Declaration
protected virtual bool MultilineInput { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
Remarks
This property determines whether the component renders as a single-line input or a multi-line textarea element.
When true
, additional styling and behavior for multi-line text handling will be applied.
ValidateOnInput
Gets or sets a value indicating whether validation should be performed on each input change rather than only on blur.
Declaration
public bool ValidateOnInput { get; set; }
Property Value
Type | Description |
---|---|
System.Boolean |
|
Remarks
When set to true
, this property enables real-time validation as the user types, providing immediate feedback.
When false
(default behavior), validation occurs only when the component loses focus, which is the standard form validation pattern.
Note: The ValueChanged event will still be fired after the component loses focus regardless of this setting.
Value
Gets or sets the current value of the input component.
Declaration
public TValue Value { get; set; }
Property Value
Type | Description |
---|---|
TValue | A value of type |
Remarks
This property supports two-way data binding and will automatically trigger the ValueChanged event when modified.
The value type is determined by the generic type parameter TValue
.
ValueChanged
Gets or sets the event callback that is triggered when the value of the component changes.
Declaration
public EventCallback<TValue> ValueChanged { get; set; }
Property Value
Type | Description |
---|---|
Microsoft.AspNetCore.Components.EventCallback<TValue> | An Microsoft.AspNetCore.Components.EventCallback<> that represents the value change event handler. |
Remarks
This callback is essential for two-way data binding and is automatically invoked when the component's value is modified. Use this to respond to value changes and update your application's state accordingly.
Methods
ChangeHandler(ChangeEventArgs)
Provides a virtual method for derived classes to implement custom change event handling logic.
Declaration
protected virtual Task ChangeHandler(ChangeEventArgs args)
Parameters
Type | Name | Description |
---|---|---|
Microsoft.AspNetCore.Components.ChangeEventArgs | args | The change event arguments containing the updated value, or |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | A System.Threading.Tasks.Task that represents the asynchronous change handling operation. |
Remarks
This virtual method serves as an extension point for derived classes to implement component-specific change processing logic while maintaining the base class's standard change event handling behavior.
FocusHandler(FocusEventArgs)
Provides a virtual method for derived classes to implement custom focus handling logic.
Declaration
protected virtual Task FocusHandler(FocusEventArgs args)
Parameters
Type | Name | Description |
---|---|---|
Microsoft.AspNetCore.Components.Web.FocusEventArgs | args | The focus event arguments containing information about the focus operation. |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | A System.Threading.Tasks.Task that represents the asynchronous focus handling operation. |
Remarks
This virtual method serves as an extension point for derived classes to implement component-specific focus processing logic while maintaining the base class's standard focus handling behavior.
FocusOutHandler(FocusEventArgs)
Provides a virtual method for derived classes to implement custom focus-out (blur) handling logic.
Declaration
protected virtual Task FocusOutHandler(FocusEventArgs args)
Parameters
Type | Name | Description |
---|---|---|
Microsoft.AspNetCore.Components.Web.FocusEventArgs | args | The focus event arguments containing information about the blur operation. |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | A System.Threading.Tasks.Task that represents the asynchronous focus-out handling operation. |
Remarks
This virtual method serves as an extension point for derived classes to implement component-specific blur processing logic while maintaining the base class's standard focus-out handling behavior.
FormatValue(String)
Converts a string value to the strongly-typed value expected by the component.
Declaration
protected virtual TValue FormatValue(string genericValue)
Parameters
Type | Name | Description |
---|---|---|
System.String | genericValue | The string value to be converted. |
Returns
Type | Description |
---|---|
TValue | A value of type |
Remarks
This virtual method provides the default parsing behavior and can be overridden in derived classes to implement custom parsing logic, validation, or type-specific conversion rules.
FormatValueAsString(TValue)
Converts a strongly-typed value to its string representation for display purposes.
Declaration
protected virtual string FormatValueAsString(TValue formatValue)
Parameters
Type | Name | Description |
---|---|---|
TValue | formatValue | The value to be formatted as a string. |
Returns
Type | Description |
---|---|
System.String | A string representation of the value, or |
Remarks
This virtual method provides the default string formatting behavior and can be overridden in derived classes to implement custom formatting logic, such as number formatting, date formatting, or cultural considerations.
InputHandler(ChangeEventArgs)
Provides a virtual method for derived classes to implement custom input handling logic.
Declaration
protected virtual Task InputHandler(ChangeEventArgs args)
Parameters
Type | Name | Description |
---|---|---|
Microsoft.AspNetCore.Components.ChangeEventArgs | args | The change event arguments containing the input data, or |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | A System.Threading.Tasks.Task that represents the asynchronous input handling operation. |
Remarks
This virtual method serves as an extension point for derived classes to implement component-specific input processing logic while maintaining the base class's standard input handling behavior.
OnAfterRenderAsync(Boolean)
Asynchronously performs operations after the component has been rendered to the DOM.
Declaration
protected override Task OnAfterRenderAsync(bool firstRender)
Parameters
Type | Name | Description |
---|---|---|
System.Boolean | firstRender |
|
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | A System.Threading.Tasks.Task that represents the asynchronous post-render operation. |
Overrides
Remarks
This method is called after each render cycle and performs the following operations:
- Calls the base class post-render logic
- On first render, initializes JavaScript functionality for button groups if present
- Ensures proper DOM integration and event binding
OnChangeHandler(ChangeEventArgs)
Declaration
protected Task OnChangeHandler(ChangeEventArgs args)
Parameters
Type | Name | Description |
---|---|---|
Microsoft.AspNetCore.Components.ChangeEventArgs | args |
Returns
Type |
---|
System.Threading.Tasks.Task |
OnInitializedAsync()
Asynchronously initializes the component during the initial rendering phase.
Declaration
protected override Task OnInitializedAsync()
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | A System.Threading.Tasks.Task that represents the asynchronous initialization operation. |
Overrides
Remarks
This method is called once when the component is first initialized and performs the following operations:
- Sets up the default script modules if no specific component reference is provided
- Initializes the icon position for component elements
- Configures the initial clear button state
- Calls the base class initialization logic
OnInputHandler(ChangeEventArgs)
Handles input events from the HTML input element, managing value updates, validation, and floating label behavior.
Declaration
protected Task OnInputHandler(ChangeEventArgs args)
Parameters
Type | Name | Description |
---|---|---|
Microsoft.AspNetCore.Components.ChangeEventArgs | args | The change event arguments containing the current input value. |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | A System.Threading.Tasks.Task that represents the asynchronous input handling operation. |
Remarks
This method coordinates input event processing with the following operations:
- Updates floating label positioning based on input content
- Manages clear button visibility
- Performs real-time validation when ValidateOnInput is enabled
- Calls virtual InputHandler(ChangeEventArgs) for component-specific logic
- Triggers the Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.OnInput event callback
OnParametersSetAsync()
Asynchronously processes parameter changes and updates the component state accordingly.
Declaration
protected override Task OnParametersSetAsync()
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | A System.Threading.Tasks.Task that represents the asynchronous parameter processing operation. |
Remarks
This method is called whenever the component's parameters change and performs the following operations:
- Calls the base class parameter processing logic
- Triggers pre-render processing if no specific component reference is set
- Updates internal state based on the new parameter values
OnPasteHandler(ClipboardEventArgs)
Handles paste events from the clipboard, allowing components to respond to paste operations.
Declaration
protected Task OnPasteHandler(ClipboardEventArgs args)
Parameters
Type | Name | Description |
---|---|---|
Microsoft.AspNetCore.Components.Web.ClipboardEventArgs | args | The clipboard event arguments containing information about the paste operation. |
Returns
Type | Description |
---|---|
System.Threading.Tasks.Task | A System.Threading.Tasks.Task that represents the asynchronous paste handling operation. |
Remarks
This method serves as a bridge between the DOM paste event and the component's Syncfusion.Blazor.Inputs.SfInputTextBase<TValue>.OnPaste event callback, enabling custom paste handling logic such as data validation, formatting, or content filtering.
SetEnabled()
Configures the enabled/disabled state of the component by applying appropriate CSS classes and HTML attributes.
Declaration
protected void SetEnabled()
Remarks
This method manages the component's enabled state by:
- When disabled: adds disabled CSS classes, sets the "disabled" attribute, and configures ARIA accessibility attributes
- When enabled: removes disabled styling and attributes, restores interactive functionality
- Updates both container and input element styling to reflect the current state
WireClearBtnEvents()
Declaration
protected Task WireClearBtnEvents()
Returns
Type |
---|
System.Threading.Tasks.Task |