The Text Field component lets you add a field where users can enter text.
To use the Text Field component in your project:
- Open the Components panel, then the UI folder.
- Drag the Text Field component to the stage.
- You may want to use the Label component to display text before the text field.
|Name||The component name.|
|Placeholder||The text shown to users inside the text field when nothing has been entered. The placeholder is for display only, and doesn't affect the field's value.|
|Value||The default text in the text field. The value overrides the placeholder.|
Events and actionsEvents sent by the Text Field component
You can trigger other actions based on the following Text Field component events:
|Change||Sent when a change to the text field's value is committed (e.g., the user edits the value then clicks elsewhere on the page).|
|Input||Sent when the text field's contents changes.|
To select one of these events in the Event dialog, set the Text Field component as the target.
The following Text Field component actions can be triggered in response to other events:
|Select text in range||
|Select all text||none|
When you select one of these actions in the Event dialog, set the Text Field component as the receiver.
Learn how to configure events.
You can't interact with UI components inside the Google Web Designer interface. To see the component in action, preview your document in your preferred browser. The appearance of UI components may vary depending on the browser.