Configuring presentation options for a date range calendar control

Configure the control to be editable or read-only for the application users, apply conditions and specify how the cell appears on the form.

Before you begin: In the layout of the form that you are editing, complete the following task: Adding a Date time control to a layout
  1. Click the control, and then click the View properties icon.
  2. In the Properties panel, click the Presentation tab.
  3. From the Edit options list, select a setting for the Date time control.
    These selections take precedence over section and harness settings.
    • To make the property use the edit mode of the section or harness in which it appears, select Auto.
    • To make property values read-only for end users, select Read-only (always).
    • To make property values read-only for end users in specified cases, select Read-only (expression). In the adjacent field press the Down Arrow key to select the expression used to evaluate the conditions on which property values are read-only.
    • To make property values read-only for end users in specified cases, select Read-only (when rule). In the adjacent field press the Down Arrow key to select the when rule that determines the conditions on which property values are read-only.
    • To make property values always editable for end users, select Editable.
  4. For Auto (default) or Editable options, in the Specify Size section/field, define the control width in a form:
    • To automatically adjust the control area width to the layout, click Auto.
    • To manually specify a fixed width for the control, click Custom. In the Width fields enter the size in pixels or as a percentage.
  5. Optional: To specify the range of dates that the users can select, in the Min date and Max date fields, enter the thresholds.
  6. Optional: To allow users to enter numerical values when the field is in focus, select the Display value using read-only formatting check box.
    The required format is applied automatically.
  7. Optional: In the Label format field, press the Down Arrow key, and then select a format of the label that you want to apply at run time.
  8. To apply custom styling to the cell, expand the Advanced Presentation Options section.
    Instead of creating a new custom format in the skin, you can adjust elements in a cell by applying Cascading Style Sheet (CSS) helper classes. For example, you can use a CSS helper class to center an element in a cell or to double the standard right margin for the element.
    • Cell read-write classes – Click the Open helper class picker icon to specify one or more CSS helper classes to apply to this cell when the form is displayed in read-write mode. You can enter several helper classes, separated by a space. Alternatively, you can enter the name of a custom style to apply to this cell.
    • Cell read-only classes – Click the Open helper class picker icon to specify one or more CSS helper classes to apply to this cell when the form is displayed in read-only mode. You can enter several helper classes, separated by a space. Alternatively, you can enter the name of a custom style to apply to this cell.
    • Inline style (not for production use) – You can use this field to define an inline style by entering CSS code. However, entering an inline style results in a guardrail warning. For maintainability and reuse, the recommended approach is to use read-write or read-only classes.
    For more information, see CSS helper classes.

  9. Click Submit.