display.screen.use()

display.screen.use()

Description

display.screen.use() specifies that an HTML template with EJS scripting is used to render a record format of a Rich Display File. The Rich Display JSON is then used only to describe the record format's fields; the look and feel of the screen comes from the HTML template instead of the Visual Designer layout.

Once a template has been assigned, the record format is displayed as usual with display.screen.execute() or a combination of display.screen.write() and display.screen.read(). The template receives an object whose properties are the record format's field values (in lower case when the display is in compatibility mode), plus a flags object with any indicator values. Form inputs in the template whose name attribute matches a field name are returned into that field when the screen is submitted with pui.submit().

Because Profound.js applications are single-page applications, the template must not be a full HTML document. It must not include <html>, <title>, or <body> tags, and should contain only the body content to render. The browser page is not reloaded.

Syntax

display.screenName.use(htmlTemplateFile) display.screenName.use(htmlTemplateFile, ejsOptions)

Parameters

  1. HTML template file (String) - The path to the HTML template file, relative to the modules directory. If the path is not qualified, the pathlist is used to search for the file.

  2. EJS options (Object, optional) - A JavaScript object of EJS options, as documented at ejs.co.

Return Value

Nothing is returned.

Examples

Example 1: Render a Record Format with an HTML Template

Assigns a template to the myscreen record format and then shows it. The template replaces the Visual Designer layout for that format only; other formats in the file are unaffected.

Prerequisite: a Rich Display File named mydisplay.json with a record format named myscreen, and an HTML file named myscreen.html in the modules directory.

pjs.defineDisplay("mydisplay.json"); mydisplay.myscreen.use("myscreen.html"); // Use the HTML template for this record format mydisplay.myscreen.execute(); // Show the screen and wait for the user

Example 2: Bind Template Fields and Read the Response

A template that shows a customer name and lets the user change it. The <%= %> tags output field values, the name attribute of the input returns the value into the custname field, and the buttons submit the screen. The module loops until the Exit button sets the exit indicator.

Prerequisite: a Rich Display File named customer.json with a record format named detail that contains the fields custno and custname and an indicator field named exit, and the template below saved as customer_detail.html in the modules directory.

customer_detail.html
<h1>Customer <%= custno %></h1> <!-- The value typed here is returned into the custname field --> Name: <input type="text" name="custname" value="<%= custname %>" /> <!-- Submit the screen; the second button also sets indicator "exit" --> <input type="button" value="Save" onclick="pui.submit()" /> <input type="button" value="Exit" onclick="pui.submit('exit')" />
Server-side module
pjs.defineDisplay("display", "customer.json"); display.detail.use("customer_detail.html"); // Render the detail format with the template custno = 1001; custname = "ACME Corporation"; while (!exit) { display.detail.execute(); // Show the template and wait for the submission if (!exit) console.log("New name: " + custname); }

RPG Equivalent

None.


Related Pages