Harness and Section forms - Adding a Text Input control

A cell in a layout can present the value of a property, as display-only or as an input field. Follow these instructions to control the presentation of a property value in a Text Input control.

Configure styles for the Text Input control using the Skin rule. See Skin form — Components tab — Controls — Text inputs.

The Text Input control uses the auto-generated control pxTextInput. Its look and behavior are governed by the rule form's Control tab. The Parameters tab is not available and the HTML cannot be edited. As a best practice, do not modify a copy of the rule. Instead, use the Parameters dialog available in the control's Cell Properties panel while designing a section, flow action, or harness. See Completing the Control tab.

As a best practice, use the pxTextInput control in new development, rather than the non-auto-generated Default controls.

  1. From the Basic control group, select Text input.
  2. Drag the control into the layout and release the mouse button to drop the control.
    If you are using a cell-based layout and you drag the control into a cell that is not empty, then the dropped control replaces the current contents of the cell.
  3. Click the View properties icon to display the Properties panel and complete the following tabs:
What to do next: 

The UI Gallery landing page contains a working example of this element. To display the gallery, in Dev Studio, click Configure > User Interface > Gallery > UI elements.

Use these Windows operations to speed development:

  • To move a cell containing an Text Input control, select the cell and drag and drop it in another cell in the same layout or another layout.
  • To cut, copy, or paste a Text Input control in a cell, right-click in the cell to access a context-menu.