×

Please give details of the problem

Docs

Find

    Developer Guide

    1. Composite API Example
      1. Scripted Lanes
      2. Compound Organization Hierarchy
      3. Dynamic Lanes
      4. Delegation
      5. Access Rights
      6. Runtime Lanes
        1. Todo Validation
      1. Release Your User Login
      1. Collections To Array
      2. Collections To List
      3. Collections BackOffice
      4. Collection JS Freemarker
          1. Composite API Design Tab
          2. Composite API Configuration Tab
          1. Providers
          2. Connectors
          3. Processes
          1. Roles entities
          2. Organization
        1. Collections
          1. Project Files Tab
          2. Project Definition Tab
          3. Project Versioned Files Tab
          4. Project Version Tab
          5. Project Description Tab
          6. Version
          7. Project Rights Tab
          8. Project Collection Tab
          1. Web Interface JS Tab
          2. Web Interface Design Tab
            1. Image Widget
            2. FileUpload Widget
            3. StaticText Widget
            4. ProgressBar Widget
            5. TextInput Widget
            6. JavaScript Widget
            7. Section Widget
            8. Geolocation Widget
            9. Checkbox Widget
            10. RadioButton Widget
            11. Tree Widget
            12. Spinner Widget
            13. History Widget
            14. URLInput Widget
            15. Tab Widget
            16. List Widget
            17. Array Widget
            18. HTML Editor Widget
            19. Report Widget
            20. Button Widget
            21. Custom Widget
            22. Captcha Widget
            23. HTML Widget
            24. Multi Checkbox Widget
          3. Web Interface Analytics Tab
          4. Web Interface Collection Tab
          5. Web Interface Implementation Tab
          6. Web Interface API Tab
          7. Web Interface Stylesheet Tab
        2. Revision
        3. Custom Lists
          1. Process Variables Tab
          2. Process Measures Tab
              1. Process Timer Event
              2. Process Start Event
              3. Process Intermediary Event
            1. Gate
              1. Process Task Loop Tab
              2. Process Task Manual Tab
              3. Process Task Email Tab
              4. Process Task Connector Tab
              5. Process Task SubProcess Tab
              6. Process Task Functional Tab
              7. Process Task Script Tab
            2. Process Step Output Variables
            3. Process Step Testing Variables
            4. Process Step Input Variables
          3. Process General Tab
          4. Process Design
          5. Process Input Tab
        1. Home
        2. My Applications
        3. Files
      1. Customer Management
        1. Messages
        2. Scheduled Process
        1. Process Examples
        2. Connectors
        1. Users
        2. Configuration
        3. Usage
        1. Web Interface Reports
          1. Measuring
          2. Runtime Users
          3. Execution Path
          4. Parameters
        1. CSS Examples
        2. CSS Personalization
      1. Performance
        1. Logout
        2. Redirection ExecutionMode
        3. Information Tags
        4. Basket
        5. Menu Bar
        6. Header
        7. Custom Login Page
        8. Mobile Devices
          1. homepage.css
          2. homepage.js
        1. Inject JSONObject
        2. Google Tables
        3. ArrayJSON to JSONArray
        4. Label Modification
        5. Number Currency Format
        6. Launch Process JQuery
        7. Date
        8. JQuery
        9. Round
        10. Holidays
        11. Array From WS
        12. Column Inactivation
        13. Print JSONObject
        14. Initialization Widget Date
        15. Invalid Fields
        16. List Reinitialization
        1. Tags
        2. Dialog Window
        3. Dynamic List
        4. User Lane Picker
          1. Report Chart
          2. Google Visualization
          3. Chart Dashboard
          4. Chart Dashboard Collection
        5. API Listener
        6. JavaScript Report
        7. Retrieving Variables Values
        8. Collection
        9. File Preview
        10. Autocomplete Widget
        11. Summing Array
      1. Trigger
      2. Markdown Template
        1. Task Reminder Email
        2. JavaScript Inclusion
        3. PDF
        4. SubProcess
        5. Backloop
        6. Variable Mapping
        1. Salesforce Computation
        2. Number Currency Format
        3. List Hash Sequence
        4. JSONObject Creation
        5. Freemarker Container Test
        6. JSONObject Concatenation
        7. Metadata
        8. Special Freemarker Characters
        9. List 1000+ Objects
        10. Dynamic Variable
        11. File Visibility
        12. Number Test
        13. JSONObject Keys Values
        14. Lock
        15. JSONArray Conversion
        16. Error Handling
        17. Loop
        18. Array To List
      1. Process Reporting API
      1. Offline
      2. Mobile

    How to use collection data in a Array

    First, read the tutorials:

    Goal

    Let's configure 2 linked lists in an array : in every row, a list of car brands (col1), and a list of car names from the selected brand (col2).

    2012-05-31_162958

    Concept

    Creating linked lists in the array widget is the same as out of the array. You just have to set dynamically the variable name of the variable based lists.

    An array widget is a set of columns. Each column has a specific widget type. As from a row to another on the same column, the content of the variable based list may be different, the variable names they rely on must be different.

    The concept is to set dynamically the names :

    Column 'Name' : 1st cell : vb_name = vb_car_0, 2nd cell : vb_name = vb_car_1 etc...

    Design

    Create a new webinterface and add an array widget :

    2012-05-31_163723

    • variable my_cars
    • identifier id_my_cars
    • 1st column

      • label: 'Brand'
      • type: 'List'

        • Type: 'Custom list'
        • List : 'Car brands'
      • value variable: brand_id

      • label variable: brand_label

    2012-05-31_164407

    • 2nd column

      • label: 'Name'
      • type: 'List'

        • Type: 'Variable based'

        • List variable: vb_car (it won't be used. Just don't leave that field empty)

        • value variable: name
      • label variable: car_id

    2012-05-31_164446

    • 3rd column

      • label: 'js listen brand_id'

      • type: 'Javascript'

      • make it invisible

      • Listen to variable: my_cars.brand_id[P_index]

    2012-05-31_164523

    • Script as below

    Code

    1
    2
    3
    4
    5
    6
    var vb_name = "vb_name_" + P_index;
    var p_widget = id_my_cars.id_name[P_index];
    
    var my_pattern = {};
    my_pattern.brand_id = [[my_cars.brand_id]][P_index];
    col_cars.listCallback(my_pattern,{},set_list_names(vb_name,p_widget),get_names_ko);
    

    Note : this javascript will listen to the 'Brand' cell on the same row ([[my_cars.brand_id]][P_index]), then will retrieve associated car names from the collection and set the result in the 'Name' cell on the same row (id_my_cars.id_name[P_index]).

    When the call to the collection is performed, it will then call &set_list_names or get_names_ko functions. Let's define them in a js widget included in a split widget at the bottom of the webinterface.

    2012-05-31_165442

    Label as 'js def' (1) and script as below (2):

    Code

     1
     2
     3
     4
     5
     6
     7
     8
     9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    function set_list_names(vb_name,p_widget) {
    return function (result) {
    var vb_car = new Array();
    for(i=0;i<result.length;i++) {
    vb_car.push({"label":result[i].name,"value":result[i].car_id});
    }
    // set the name of the variable of the variable based list
    p_widget.setListVariableName(vb_name);
    // set the value of the variable of the variable based list
    var a = new RMP_List();
    a.fromArray(vb_car); 
    RMPApplication.setList(vb_name,a);
    // refresh the list (required only for array widgets)
    p_widget.loadList();
    }
    
    }
    
    function get_names_ko(result) {
     //Error while retrieving cars from brand_id
     alert("ko " + JSON.stringify(result));
    }
    

    It's done : give it a try!