Create View Templates
Templates let you describe an HTML layout within a container HTML page. To define an inline template in your HTML page, you use a <script>
tag of type “text/template”. JavaScript code can apply your template to the page design when it instantiates a new HTML page at runtime.
The search-page
template is simple. It includes a header, a search field, and a list to hold the search results. At runtime, the search page instantiates the user-list-item
template to render the results list. When a customer clicks a list item, the list instantiates the user-page
template to show user details.
-
Add a template script block with an ID set to “search-page”. Place the block within the
<body>
block after the “content”<div>
tag. -
In the new
<script>
block, define the search page HTML template using Ratchet styles. -
Add a second script block for a user list template.
-
Define the user list template. Notice that this template contains references to the SmallPhotoUrl, FirstName, LastName, and Title fields from the Salesforce user record. References that use the
<%= varname %>
format are called “free variables” in Ratchet apps. -
Add a third script block for a user details template.
-
Add the template body. Notice that this template contains references to the SmallPhotoUrl, FirstName, LastName, and Title fields from the Salesforce user record. References that use the
<%= varname %>
format in Ratchet apps are called “free variables”.