Read & Write to a Table from the Form

Owned by Marty Lechleider
Last updated: Nov 22, 2018
2 min read

In some cases it is convenient to to use tables as a summary list and do all your detail edits on the main form.  For instance - perhaps you want to collect information on beneficiaries, investments or assets.  Wouldn't it nice if you could keep a running list and do all your detail edits on the main form versus having the pop up the table dialog for each row?  Both approaches work - but sometimes you want a little more control over the user experience.

Here is an example to see.

http://leapsandbox.hclpnp.com/forms/anon/org/app/e105f1bb-ce9c-47e8-81fc-bcec0ad185b0/launch/index.html?form=F_Form1

created with HCL Leap 9

table.nitro_s



You can get a value from a field in a table by selecting the table row and referring to the field ID.  The table row selection can be done by clicking on the row (onClick event) or programmatically. 


Manual Table Row Selection

The code below is place on the table onClick event to capture the selected row.  The second line sets a field value on the main form (F_FieldB in this example) to the value of a field value in the selected table row.

var selected = item.getSelection();
BO.F_FieldB.setValue(selected.F_FieldA.getValue());


Programatic Table Row Selection

Below is example of how to programmatically select a table row and a specific field value.  In this case we are setting the variable "result" to the value of F_SelectOne2 in table row 2. Arrays - which is what tables are - always start with 0, which means BO.F_Table1.get(1) will get the 2nd row.  This assumes you know which row to select.  If you do not  - you can use this technique inside a loop where you search for the table row.

var result = BO.F_Table1.get(1).F_FieldA.getValue() ; // where i= the row number in the table.
BO.F_FieldB.setValue(result);


Going the other way - you can grab a field value on the main form and then set a selected table row / field value to it.

var selected = page.FTable1.getSelection();
selected.F_FieldA.setValue(BO.F_FieldB.getValue());


Sometimes the field you need to access is passed in as a variable, the above examples are specifically named.  In this example you will see that we use the get() function to retrieve the column from the table, where the actual field ID is passed in as a variable at run-time.

app.getSharedData().calcSumOfTableColumn = function(table, column) {

  var sum = 0;

  for(var i = 0; i < table.getLength(); i++) {
    sum += get(table.get(i),column).getValue()
  }
  return sum;
}