List Tables

You have probably seen List Tables in use on your RIB CX forms already. They are used on the ITP and LOT forms, and perhaps others on your projects as well. 

A list table will present information in a table within the form. The table may have as many columns as desired, and when in use on a form, the user is able to add as many rows as desired to the List Table, filling in each of the assigned user fields once per row.

For cases in which bulk rows of information need to be added, users may also choose to 'Download Template' and insert the data into the excel format provided, then copy and import from clipboard directly into the List table. Further detail at bottom of page. 

Here is a basic List table in use on an ITP form. 

Creating a List Table

Placing the List

1. Once inside the Form Editor, you will find the List table in the left side panel under Form Elements.

2. Drag & Drop the List element from the left panel onto the grid, into the desired position.

If you drop the List in the wrong position on the grid - not to worry! Just pick the element back up again and adjust to the desired position.



3. Now it is time to add the User Fields to your List!

In the same way that you place the List element, simply pick up the first of your User Fields from the panel on the left and drag them onto the List table. You don't need to drag them to any particular spot in the List table - just onto the table will do.

When you add new user fields, they will automatically be placed at the end of the list. 

You are able to drag and drop to rearrange the order of user fields within the list. 

It is best to place all of the user fields onto your list before getting stuck into things like the styling of the header row, column widths, etc. 

4. The next steps!

Once you have placed the List onto your form and added User Fields to the List (& Saved), you have built a basic functioning List for your form! 

From here, you might want to consider the formatting of your List table. 


Properties

The below properties are available for you to adjust in the Form Editor. 

Code 

By default, the List table will be given a code of 'tbl001', 'tbl002', etc.

You may give the List table a different code name if you prefer. 

Column Width Type

Options Available:

Pixels, Percent

Custom ClassesFor RIB use only. 
Border Styles 

Style 



Width

Color
Header Formatting Preset Styles

Click to apply. Options to choose from include: 

  • Proper Case - Blue Font 
  • Proper Case - Grey Font 
  • Proper Case - Black Font 
  • UPPER CASE - BLUE FONT 
  • UPPER CASE - GREY FONT 
  • UPPER CASE - BLACK FONT 

Font Styles

Click to apply. Options to adjust are:

Bold, Italic, Underline, Case Toggle 


Alignment 

Click to apply. Options to adjust are:

Horizontal: Left, Center, Right.     Vertical: Left, Center, Right 


Color 

To adjust the color, you can click the icon to open a color picker.

Alternatively, if you know the hex color you wish to use you can simply enter this instead.



Using the List Table 

When a List Table is in use on a form, the user is able to add as many rows as desired to the List, filling in each of the assigned user fields once per row.

Here is a basic List table in use on an ITP form. 

Calculation User Field

In RIB CX, Project Administrators are now able to include the Calculation user field. 

Depending on the type of data being recorded in the user fields, the Calculation field may be a helpful addition to some of your lists - enabling you to for perform numerical actions. For example counting the percentage completion in each row with a check box to mark the ones at 100% as 'Completed'

For more information about the Calculation User Field and how to configure, please click here . 

Adding Data to the List Table 

Generally, a List Table will have 0 rows when a form is first created. 

  • To get started (manually) populating your List Table, press 'Add Row' 
  • Now that you have your first row, click into each of the columns to input data into each of the relevant user fields.

While using List Tables, the following buttons are available: 

  • Download Template: To Import from Clipboard. See instructions below.

  • Insert Before: Insert a row BEFORE the currently selected row.
  • Delete: Delete the currently selected row. 
  • Insert After: Insert a row AFTER the currently selected row. 
  • Add Row: Insert a new row at end of list table. 
  • Drag and drop : Although this isn't a button, this is an action. You can drag and drop user fields into the list table and add data to them.
  • Deleting a user field : You can delete a user field by clicking the X icon on it

 

  • Re-adding user field : If you removed a user field and re-added it, the data in it (such as options, security settings, etc) should remain the same. 

If you remove a user field from one list table and re-add it to a different list table, user field's options/settings remain unchanged as long as no one has responded to the form or cleared any data in it. It is advisable to configure the list table before it's form is used

Searching on a List (Table)

You can use the search function in RIB CX to search on user fields located within the List. For a guide to Search on a List (Table), click here.

Import from Clipboard

For cases in which bulk rows of information need to be added, users may also choose to 'Download Template' and populate the data in this way.

1. Click 'Download Template' 

2. Open the Excel Template file and fill in the column data as desired 

3. Select all Template Table Data (excluding the Header Row) and Copy (CTRL+C)

4. Move to the List Table and Click in the Header Row 

5. Press 'CTRL+V' to paste the data from your clipboard into the List Table 

6. The List Table should now be populated with your data! 

Setting Default Values for User Fields 

You can add default values to the list user field : 

  1. Go to Configuration from menu tab, select the form that has a list table, and click 'Form Designer'
  2. Select a user field from the list table, and click 'Edit' on the right hand menu
  3. You will see 'Default Values' tab on the left
  4. Click 'Add Value' and pick the value you want to show as default 
  5. You can add more values by clicking 'Options' on the left

6. You can also import values from an Excel file by clicking 'Import Default Values' 

When the form is created the list will be prepopulated with the default values set

Set Default Values for a List via Import

Default values can be imported for all columns in the list control.

As a user you can do this by :

Selecting the List Control and click on 'Import Default Values'. This will download the template as Excel file. Then fill in the default values for each column in the spreadsheet.

Example below shows user filling in the default values in Excel spreadsheet.

Upload Excel file back into the List user field

List Control - Set Column Width to Auto

There is an option in the List Control where you can set the column width in a list to be Auto. With this option the column width automatically expands/shrinks to the longest width of the data for that column.


You can set this at List top level so that it applies to all columns or you can configure it per specific column.