TextBox

in namespace DotVVM.Bootstrap5.Controls

Extends the built-in TextBox control to allow applying Bootstrap CSS classes.

Usage & Scenarios

Extends the built-in TextBox control to allow applying Bootstrap CSS classes.

https://getbootstrap.com/docs/5.2/forms/form-control/

Sample 1: TextBox Sizing

Use the Size property to set the size of the TextBox.

<bs:TextBox Size="Small" Text="{value: Text}" />

<bs:TextBox Size="Default" Text="{value: Text}" />

<bs:TextBox Size="Large" Text="{value: Text}" />
namespace DotvvmWeb.Views.Docs.Controls.bootstrap5.TextBox.sample1
{
    public class ViewModel
    {
        public string Text { get; set; } = "DotVVM";
    }
}

Sample 2: TextBox Type

Use the Type property to set the type of the TextBox.

<bs:TextBox Type="Normal" Text="Normal textbox"/>

<bs:TextBox Type="Password" Text="Password"/>

<bs:TextBox Type="Multiline" Text="Multiline textbox"/>

<bs:TextBox Type="Color" Text="Color textbox"/>

<bs:TextBox Type="Date" Text="Date textbox"/>

Sample 3: TextBox Update Text on Input

Use UpdateTextOnInput to set wheter viewmodel property will be updated. Set True to update immediately or set False to update on focus loose.

<bs:TextBox  Text="{value: Text}"  UpdateTextOnInput="true" />

<bs:TextBox  Text="{value: Text}"  UpdateTextOnInput="false" />

<p>{{value: Text}}</p>
namespace DotvvmWeb.Views.Docs.Controls.bootstrap5.TextBox.sample1
{
    public class ViewModel
    {
        public string Text { get; set; } = "DotVVM";
    }
}

Properties

Name Type Description Notes Default Value
property icon Enabled Boolean Gets or sets a value indicating whether the control is enabled and can be modified.
attribute
inner element
static value
bindable
default
True
property icon FormatString String Gets or sets a format of presentation of value to client.
attribute
inner element
static value
bindable
default
null
property icon SelectAllOnFocus Boolean Gets or sets whether all text inside the TextBox becomes selected when the element gets focused.
attribute
inner element
static value
bindable
default
False
property icon Size Size Gets or sets the size of the TextBox.
attribute
inner element
static value
bindable
default
Default
property icon Text Object Gets or sets the text in the control.
attribute
inner element
static value
bindable
default
property icon Type TextBoxType Gets or sets the mode of the text field.
attribute
inner element
static value
bindable
default
Normal
property icon UpdateTextOnInput Boolean Gets or sets whether the viewmodel property will be updated immediately after change. By default, the viewmodel is updated after the control loses its focus.
attribute
inner element
static value
bindable
default
False

Events

Name Type Description
event icon Changed Command Gets or sets the command that will be triggered when the onchange event is fired.
event icon TextInput Command Gets or sets the command that will be triggered when the user is typing in the field. Be careful when using this event - triggering frequent postbacks can make bad user experience. Consider using static commands or a throttling postback handler.

HTML produced by the control