ButtonTextBox
A ButtonTextBox control is a combination of a text box and a button. Users can enter a text string in the text box part, and they can click on the button part. You use the ButtonTextBox control to create, for example, search boxes.
You can set a watermark or a default text that the ButtonTextBox control displays. A watermark is a non-editable text that the ButtonTextBox control displays when it is empty. You can enter a text that helps users to understand what they can enter. The watermark disappears as soon as the user enters a character, and it reappears if the user deletes all previously entered characters.
A default text is a text that the control displays, but users can change and delete this text. If you specify both a watermark and a default text, the ButtonTextBox control initially shows the default text, but if the user deletes all of this text, the watermark appears.
If you set the Type property to password, the ButtonTextBox control masks user input. Most browsers replace the characters that the user types with * (asterix) characters.
You use the ButtonType property to indicate what the button part looks like. This is only an indication: the styling that SPEAK applies will decide what the actual look is. You can choose Default, Primary, and Inverse.
You use the Click property to specify what happens when users click the button.
Properties
| Name | Description | Default |
|---|---|---|
| Appearance | ||
| ButtonImageUrl | Set the Sitecore path of an icon (for example, Network/16x16/home.png for the icon shown for the /sitecore/content/home item). | |
| ButtonText | Set the text you want to be displayed in the button part. You can enter a static text, set the text from PageCode, or you can bind this property to a property of another control. | |
| ButtonType | Select Default, Primary, or Inverse. | Default |
| Text | Specify a default text that the control displays. Users can edit and delete this text. | |
| Type | Specify either text or password. | text |
| Watermark | Specify a text that the control displays when it has no input from the user. The text is not editable, and it is not displayed if there is any user input. | |
| WidthPolicy | Specify how SPEAK interprets the width of the control. You can specify:
| Default. |
| Behavior | ||
| IsReadonly | If True, the users cannot enter text. | False |
| IsRequired | If True, the ButtonTextBox control is marked as being “required”. There is no logical effect, but some browsers style the text box differently. | False |
| MaxLength | Specify the maximum number of characters users can input in the ButtonTextBox control. The control does not accept any more input when the number of characters reaches this number. | |
| Events | ||
| Click | Specify JavaScript that SPEAK executes when a user clicks the button. |
Configuration
You can create a configuration item for a ButtonTextBox control by creating an item based on the ButtonTextBox Parameters template.
The configuration item has these specific fields:
- Text
- Type
- Watermark
- ButtonImageUrl
- ButtonText
- ButtonType
It inherits these fields:
- Click
- IsEnabled
- IsVisible
- AccessKey
- Tooltip
- Behaviors
- Id