Skip to main content
Kinetic Community

Creating List Options based on Table Contents

It may be desired to create list options from a data table in the item.


This example will extend the solution Populating a Table Using a Simple Data Request. This example will populate a list question with answers that are equal to the login IDs populated in the table. This could, for example, be used to indicate which existing user to add a role/permission to.


There is a small change to the populateUserTable function to add, after the table is built, to build the list of answers for the question "User to Update" (line 38). 

function populateUserTable(response) {
  // CONFIGURE: The following variable defines which element the YUI data table
  //   will be inserted into and will need to be set to an element that exists
  //   in the service item.
  var containerElement = "userTable";

  // CONFIGURE: The following variable defines what columns will be displayed in
  //   the table and will need to be configured for the specific Simple Data
  //   Response.
  var columnDefinitions = [
    {key:"date", label:"Modified Date"},
    {key:"login", label:"Login Name"},
    {key:"name", label:"Full Name"}

  // CONFIGURE: The following variable defines how the Simple Data Request XML
  //   result will be parsed by the data table and will need to be configured
  //   for the specific Simple Data Response.
  var schemaDefinitions = [
    {key:"date", locator:"field[@id='Modified Date']"},
    {key:"login", locator:"field[@id='Login Name']"},
    {key:"name", locator:"field[@id='Full Name']"}

  // Initialize a dataSource to process the results
  var dataSource = new YAHOO.util.DataSource(response.responseXML);
  dataSource.responseType = YAHOO.util.DataSource.TYPE_XML;
  dataSource.useXPath = true;
  dataSource.responseSchema = {resultNode: "record", fields: schemaDefinitions}

  // Ensure that the body element has the yui-skin-sam class so that the YUI
  // css classes for data tables are applied properly.
  YAHOO.util.Dom.addClass(document.body, 'yui-skin-sam');

  // Build the data table widget
  var dataTable = new YAHOO.widget.DataTable(containerElement, columnDefinitions, dataSource);
  // Build the options/answers for the User to Update question from the data in this table
  buildListFromDataTable("User to Update");

Then the function buildListFromDataTable clears any existing options out of the table, then loops through the table records to create a new set of options.

function buildListFromDataTable(destination_question) {

  //get the record set from the table
  var records = dataTable.getRecordSet().getRecords();
//get a reference to the List question element
  var dlist = KD.utils.Util.getAnswerLayer(destination_question);

//reset the List question
  dlist.firstChild.length = 0;
  dlist.firstChild.options[0] = new Option("", "");

//iterate through the records in the table for the column (as specified by the id of the column in the schema)
//and create a new option entry in the List question
  for (i=0;i < records.length;i++) {
    dlist.firstChild.options[i+1] = new Option(records[i].getData("login"), records[i].getData("login"));