Textbox

Use this widget to give the user the opportunity to enter free text no longer than a line, such as street address, e-mail, etc.

After you have dragged the Textbox form widget in your form, click the Edit button in the upper-right corner of the widget.
The Textbox window appears, displaying the following sections:

In this section, perform the following:

1. In Label input field, enter the label of the textbox.
   For example, enter Address or Email
2. In Instructional text, enter instructions or explanatory text for the textbox, if needed.
   The text is displayed bellow the textbox.
3. In Field type, select what kind of input you expect to be entered in this field.
   You can select between Text, Email, Phone, or URL.
   You can configure field validation in the Advanced widget settings.
4. Optionally, in Placeholder text, you can enter some text to facilitate the user in filling out the field.
   For example, if the field is an email field, you can enter someone@server.com. This text is only a guidance for the user and is not submitted with the form response, if the user does not change it.
5. Optionally, in Predefined value, you can enter a predefined value for the textbox that is displayed in the box by default and the user can change it.
   If the user does not change the predefined value, it is submitted with the form response.
6. If you want to make the textbox mandatory, select the Required field checkbox.
   A textbox appears, where you enter the error message that is displayed, if the user does not fill out the textbox.
7. If you want this field to be visible in the form only when certain conditions are met, select Hide field initially checkbox.
   You can then use form rules to display the field. For more information, see Form rules.

In this section, perform the following:

1. In Range input fields, enter the minimum and maximum number of characters that a user can enter in the textbox.
   If you do not want to impose limits to the textbox, leave the Max input field empty and the Min input field empty.
2. Enter an error message that is displayed, if the user input is out of range.

In this section, perform the following:

1. In Template dropdown, you can select a template other than the default one that will be used to display the Textbox on the website.
   You must first have created a custom template. For more information, see Create and edit widget templates.
2. In Field size, you can choose the size of the input field.
   Choose from the predefined values of none, small, medium, or large.
3. Save your changes.

To open the advanced settings, in the upper-right corner of the Textbox widget page, click  (Advanced settings).

Apply custom CSS

In CSS class input field, you can choose a class name for the textbox, if later you want to set a CSS style for this particular textbox.

Developer name

Developer name is used to refer to the textbox field in the code, when submitting the form data to Sitefinity. It will be automatically generated, if left empty. Note that this value cannot be changed after the form is published.

Save your changes.

Validate the user input

You can add validation of the user input in textboxes. For example, you can make required that the user enters an email address in a certain textbox.

To do this, in Regular expression validation pattern field, enter one of the following:

Display validation error message

In Regular expression error message, you can enter a custom error message.
For example, if you are validating that the user entered an email address, you can also enter a custom error message – for example, Invalid email format