Creating or configuring forms > Configuring the <queue> element > Defining the queue interface

6.3.2 Defining the queue interface

You can configure the way a queue item is displayed to the user.

To define the queue interface

  1. Open the appropriate XML file located in the Viewpoint home directory. Locate the <queue> element. Modify the name if desired.
  2. Locate the <title> element and set the <description> text to whatever explanatory text you would like displayed before the value. Ensure that the title contains the desired component.
  3. The <title> element is optional.

  4. Modify the <row> element.
    1. Set the order attribute to the number order which the indicated line should be displayed on the page. For example, to place a row at the top, set order to "1".
    2. Set the required attribute to either true or false, depending on whether the row should display even if the value is empty or zero.
  5. Make a row dynamic so that the exact number of rows is dependent on the components in the form.
    1. Set the type attribute of <row> to "dynamic".
    2. Set the source attribute of <row> to any component that contains a list of values. For example, you might use a list edit component.
  6. <row order="2" type="dynamic" source="storage-list">
    <description>Storage:</description>
    <component id="storage-list" />
    </row>

    The second row in the queue item creates however many items are in the "storage-list" component.

  7. Modify the CSS to customize the view for individual components.
    1. Open the utility-hosting.css file.
    2. Modify the CSS styles according to the following:
      • Modify the ace-DynamicQueueItem-titleDescription style to customize the style of the title's description, assuming the description is not empty.
      • Modify the ace-DynamicQueueItem-titleValue to customize the style of the title's value, assuming the value is not empty.
      • Modify the ace-DynamicQueueItem-rowDescription to customize the style of the row's description, assuming the description is not empty.
      • Modify the ace-DynamicQueueItem-rowValue to customize the style of the row's value, assuming the value is not empty.

Related topics