Profound.js API, the HTML Container widget, and the AJAX Container widget allow for the use of EJS, a syntax that supports dynamic JavaScript templating code embedded within HTML.

This capability provides for a simple implementation of custom dynamic HTML output, including features like:

EJS provides special tags that can be used within the HTML:

The following JavaScript variables are inherently available within EJS:

The field names and subfile record names can be referenced using all lower case or all upper case.

 

Example 1:

The following will show 2 fields (LASTNAME and FIRSTNAME) flowing one after the other regardless of the width of any field's contents.

First, add an HTML Container widget. Bind the "user defined data" property to the LASTNAME field. Bind the "user defined data 2" property to the FIRSTNAME field. Then, put the following code into the "html" property:

<%= LASTNAME.trim() %>, <%= FIRSTNAME %>

 

Example 2:

The following will show a subfile as an HTML table:

Add a Subfile Grid widget. Add fields named LASTNAME and FIRSTNAME into the grid. Name the grid record format "SFL". Then, hide the grid.

Then add an HTML Container widget and put the following code into the "html" property:

<table width="100%" border="1">
  
  <tr>
    <th>Last Name</th>
    <th>First Name</th>
  </tr>
  
  <% for (i = 0; i < sfl.length; i++) { %>
    <tr>
      <td>  <%= sfl[i].LASTNAME  %> </td>
      <td>  <%= sfl[i].FIRSTNAME %> </td>
    </tr>
  <% } %>
 
</table>


 

 

Example 3:

The following will show a subfile as an Unordered List:

Add a Subfile Grid widget. Add fields named FIRSTNAME and LASTNAME into the grid. Name the grid record format "SFL". Then, hide the grid.

Then add an HTML Container widget and put the following code into the "html" property:

<ul>
    
  <% for (i = 0; i < sfl.length; i++) { %>
    <li> <%= sfl[i].FIRSTNAME.trim() + ' ' + sfl[i].LASTNAME.trim()  %> </li>
  <% } %>
 
</ul>