Skip to main content
LinkedIn
Copied!

Table of Contents

Defining a JavaScript function when sourcing large data pages from a connector, activity, or data transform

Version:

Only available versions of this content are shown in the dropdown

To source large data pages from a connector, activity, or data transform, define the JavaScript populator function in a Pega Platform text file.

Create a separate populator function for each large data page that populates a UI element.
Create and configure a data page that you later declare as large. For more information, see Creating a data page when sourcing large data pages from a connector, activity, or data transform.
  1. In the header of Dev Studio, click Create Technical Text File .

  2. On the Create Text File tab, in the Text File Record Configuration section, configure the text file:

    1. In the Label field, enter <datapage-name>_datapage_api.

      The datapage-name variable corresponds to the data page that you created in Creating a data type when sourcing large data pages from a connector, activity, or data transform.
      For the D_Expenses data page, in the Label field, enter expenses_datapage_api.
    2. In the App Name (Directory) field, enter webwb.

    3. In the File Type (extension) field, enter js.

  3. In the Context section, specify the branch and ruleset for the file.

  4. Click Create and open.

  5. On the text file tab, on the Main tab, in the text field, define the custom populator by entering the following JavaScript code:

    var <function-name> = function(parametersMap, clientStore, onSuccess, onFailure) {
        var targetDatapageName = "<datapage-name>";  
        var query = "SELECT <field-name1>, <field-name2>, <field-name3> FROM <datapage-name>";
        var queryParameters = [];
        clientStore.runQuery(query, queryParameters, targetDatapageName, onSuccess, onFailure); 
    } 
    pega.ui.ClientCache.registerLargeDatapage("<datapage-name>", <function-name>);

    where:

    For the D_Expenses data page, in the text field, enter the following JavaScript code:

    var expensesCustomFunction = function(parametersMap, clientStore, onSuccess, onFailure) {
        var targetDatapageName = "D_Expenses"; 
        var query = "SELECT Title, Description, Amount, Currency, EmployeeID FROM D_Expenses"; 
        var queryParameters = [];
        clientStore.runQuery(query, queryParameters, targetDatapageName, onSuccess, onFailure); 
    } 
    pega.ui.ClientCache.registerLargeDatapage("D_Expenses", ExpensesCustomFunction);

    To filter the source data page returns or to join data from separate large data pages, further customize the populator function. For more information, see Further customizing data population for large data pages.

    To learn more about the structure of the populator function, see Data population for large data pages in offline-enabled mobile apps.

  6. Click Save.

Add the text file that contains the JavaScript populator function to your application. For more information, see Adding JavaScript code to Pega Platform applications when sourcing large data pages from a connector, activity, or data transform.
Suggest Edit
Did you find this content helpful?

Have a question? Get answers now.

Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.

Ready to crush complexity?

Experience the benefits of Pega Community when you log in.

We'd prefer it if you saw us at our best.

Pega Community has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice
Contact us