loadhtml()

Loads HTML content from the specified HTML file. The file may be located inside the template (see Snippets) or hosted on a Content Management System or on another location outside the template.

An optional selector allows you to retrieve only the content of matching elements.

  • The specified HTML file is expected to be UTF-8 encoded.
  • If the HTML contains a Dynamic Table, the table will be expanded (i.e. filled with data).
  • Any Handlebars expressions in the retrieved HTML are evaluated, using the record as input, if the current section is set accordingly. (To enable evaluating Handlebars expressions, right-click the section in the Resources pane and choose Properties.)
  • Loadhtml() is cached per batch run (based on the URL) in print/email.

Tip: To load a JavaScript file (.js) or a style sheet (.css) you can use loadtext(). See loadtext().

Tip: External content is not loaded while editing a script. To test a script that loads external content, you can do a preflight; see Doing a Preflight.

loadhtml(location)

Loads all HTML from the specified HTML file or Handlebars snippet (.hbs).

location

String containing a path that can be absolute or relative to the section/context.
Use snippets/<snippet-name> to retrieve the content from an HTML file residing in the Snippets folder on the Resources panel.
In order to retrieve files from outside the template the file protocol is supported as well as the http/https protocols.
The complete syntax of a fully qualified URL with the "file" protocol is: file://<host>/<path>. If the host is "localhost", it can be omitted, resulting in file:///<path>, for example: file:///c:/somefolder/somecontent.html.
If the file is located on another server in your network, the path must contain five slashes after "file:".
When using the http/https protocol, remember that only absolute paths are supported inside remote snippets (see Remote snippets).

Tip: To quickly get the location of a snippet in the template resources, right-click the snippet in the Resources pane and select Copy Resource Location.
The path to a remote snippet can be copied from the snippet's properties: right-click the snippet in the Resources pane and select Properties.

Note: Mapped network drives are usually not accessible to the server. Use a UNC path instead (e.g. file://///myserver/myfolder/file.txt).

Examples

This script loads a local HTML snippet (from the Resources panel) directly into the matched elements

Copy
results.loadhtml("snippets/snippet.html");

The following script loads a local HTML snippet (Resources panel) into a variable. The replaceWith() command is used to replace the element(s) matched by the script's selector with the contents of the snippet.

Copy
var mysnippet = loadhtml('snippets/snippet.html'); results.replaceWith(mysnippet);

Same result as the previous script, but a different notation:

Copy
results.replaceWith(loadhtml('snippets/snippet.html'));

The following script loads a snippet into a variable and finds/replaces text in the variable before inserting the content into the page. The second find command also adds formatting to the replacing text.

Copy
var mysnippet = loadhtml('file:///C:/Users/PParker/Documents/Example.html'); 
mysnippet.find('@var1@').text('OL Connect 1'); 
mysnippet.find('@var2@').html('<i>OL Connect 2</i>').css('text-decoration','underline'); 
results.replaceWith(mysnippet);

This last script loads a remote snippet into a variable and retrieves an element from the snippet using query().

Copy
var mysnippet = loadhtml('http://www.somewebsite.com/text-root-wrapped.html'); 
var subject = query("#subject", mysnippet).text(); 
results.append("<p style='font-weight: bold;'>" + subject + "</p>");

loadhtml(location, selector)

Retrieves specific content from the specified HTML file or Handlebars snippet (.hbs).

location

String containing a path that can be absolute or relative to the section/context.
Use snippets/<snippet-name> to retrieve the content from an HTML file residing in the Snippets folder on the Resources panel.
In order to retrieve files from outside the template the file protocol is supported as well as the http/https protocols.
The complete syntax of a fully qualified URL with the "file" protocol is: file://<host>/<path>. If the host is "localhost", it can be omitted, resulting in file:///<path>, for example: file:///c:/somefolder/somecontent.html.
If the file is located on another server in your network, the path must contain five slashes after "file:".
When using the http/https protocol, remember that only absolute paths are supported inside remote snippets (see Remote snippets).

Tip: To quickly get the location of a snippet in the template resources, right-click the snippet in the Resources pane and select Copy Resource Location.
The path to a remote snippet can be copied from the snippet's properties: right-click the snippet in the Resources pane and select Properties.

Note: Mapped network drives are usually not accessible to the server. Use a UNC path instead (e.g. file://///myserver/myfolder/file.txt).

selector

String. The supplied selector should conform to CSS selector syntax and allows you to retrieve only the content of matching elements.
If the selected element is a Dynamic Table, the retrieved HTML will contain the expanded table.

Examples​​

This script loads a specific element from a snippet and uses that to replace the results (the HTML element or set of HTML elements matched by the selector of the script; see results).

Copy
var mysnippet = loadhtml('snippets/snippet-selectors.html','#item3'); 
results.replaceWith(mysnippet);

This script loads the children of the selected element.

Copy
var snippet = loadhtml('file:///C:/Users/PParker/Documents/Example.html','foobar').children(); 
results.replaceWith(snippet);

The next script loads a remote snippet (see Remote snippets), looks for an H1 heading and uses that text.

Copy
var post = loadhtml('snippets/post.rhtml');
var h1 = query('h1', post).text();
results.text(h1);

Tip: Another example is given in the following how-to: Using a selector to load part of a snippet.