Skip to content

Text Input — Reference

Reference · Advanced · Framework7 8

Text Input settings and behavior. Settings include ID, Class, Name, Type.

Text Input settings and events. Select the component in App Structure to find these controls in Properties.

Name Description
IDDefault: "". Attribute: id.
ClassDefault: "". Attribute: class.
NameHTML name attribute. Sets the control name . This is used as the field key in form submissions and is essential for classic post submissions and many server-side handlers. Bootstrap docs: Forms overview Default: "". Attribute: name.
TypeHTML input type. Controls the underlying <input type="..."> used by the form control. Choose a type that matches the expected value (e.g. email , number , password ) for better validation and mobile keyboards. Bootstrap docs: Form control Options: text, hidden, color, date, datetime-local, time, email, month, number, password, search, tel, url, week, range Default: "text". Attribute: type.
PlaceholderPlaceholder text. Sets the placeholder text shown when the input is empty. Do not use placeholders as a replacement for labels; use them as examples or hints. Bootstrap docs: Form control Default: "". Attribute: placeholder.
Static ValueInitial/default value. Sets the control initial value. For App Connect, you often bind values reactively instead of hardcoding them. Bootstrap docs: Form control Default: "". Attribute: value.
DisabledDisables the control. Disables the form control. Disabled controls cannot be focused or edited and may be excluded from submission depending on the browser/handler. Bootstrap docs: Disabled forms Default: false. Attribute: disabled.
Read OnlyRead-only control. Makes the control read-only. Read-only controls can be focused and copied, but not edited. This is different from disabled. Bootstrap docs: Readonly Default: false. Attribute: readonly.