617 lines
33 KiB
HTML
617 lines
33 KiB
HTML
<!-- BeginDsi "dsi/head.html" -->
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<title>Embedthis Appweb 4.3.4 Documentation</title>
|
|
<meta name="keywords" content="embedded web server, web server software, embedded HTTP, application web server,
|
|
embedded server, small web server, HTTP server, library web server, library HTTP, HTTP library" />
|
|
<meta name="description" content="Embedthis Sofware provides commercial and open source embedded web servers for
|
|
devices and applications." />
|
|
<meta name="robots" content="index,follow" />
|
|
<link href="../../../doc.css" rel="stylesheet" type="text/css" />
|
|
<link href="../../../print.css" rel="stylesheet" type="text/css" media="print"/>
|
|
<!--[if IE]>
|
|
<link href="../../../iehacks.css" rel="stylesheet" type="text/css" />
|
|
<![endif]-->
|
|
<link href="http://www.google.com/cse/style/look/default.css" type="text/css" rel="stylesheet" />
|
|
</head>
|
|
|
|
<body>
|
|
<div class="top">
|
|
<a class="logo" href="http://appwebserver.org/"> </a>
|
|
<div class="topRight">
|
|
<div class="search">
|
|
<div id="cse-search-form"></div>
|
|
<div class="version">Embedthis Appweb 4.3.4</div>
|
|
</div>
|
|
</div>
|
|
<div class="crumbs">
|
|
<a href="../../../index.html">Home</a>
|
|
<!-- EndDsi -->
|
|
><a href="index.html">ESP Guide</a>> <b>Template Pages and Layouts</b>
|
|
</div>
|
|
</div>
|
|
<div class="content">
|
|
<div class="contentRight">
|
|
<h1>Quick Nav</h1>
|
|
<ul class="nav">
|
|
<li><a href="#embedded">Embedded C Code</a></li>
|
|
<li><a href="#configuration">Configuration</a></li>
|
|
<li><a href="#layouts">Layouts</a></li>
|
|
<li><a href="#paradigms">Paradigms</a></li>
|
|
<li><a href="#dir">Directories</a></li>
|
|
<li><a href="#directives">Directives</a></li>
|
|
<li><a href="#context">Request Context</a></li>
|
|
<li><a href="#compilation">Compilation</a></li>
|
|
<li><a href="#debugging">Debugging</a></li>
|
|
<li><a href="#controls">Controls</a></li>
|
|
</ul>
|
|
<!-- BeginDsi "dsi/espSeeAlso.html" -->
|
|
<h1>See Also</h1>
|
|
<ul class="nav">
|
|
<li><a href="../../../guide/esp/users/using.html">ESP Overview</a></li>
|
|
<li><a href="../../../guide/esp/users/tour.html">ESP Tour</a></li>
|
|
<li><a href="../../../guide/esp/users/template.html">Templates and Layouts</a></li>
|
|
<li><a href="../../../guide/esp/users/controls.html">HTML Controls</a></li>
|
|
<li><a href="../../../guide/esp/users/config.html">ESP Configuration Directives</a></li>
|
|
<li><a href="../../../guide/esp/users/mvc.html">Model-View-Controller</a></li>
|
|
<li><a href="../../../guide/esp/users/generator.html">Application Generator</a></li>
|
|
<li><a href="../../../guide/esp/users/controllers.html">Controllers and Actions</a></li>
|
|
<li><a href="../../../guide/esp/users/database.html">Database Interface</a></li>
|
|
<li><a href="../../../guide/appweb/users/caching.html">Caching Responses</a></li>
|
|
</ul>
|
|
<!-- EndDsi -->
|
|
|
|
<ul>
|
|
<li><a href="../../../api/esp.html">ESP Library</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="contentLeft">
|
|
<h1>Web Pages and Templates</h1>
|
|
<p>ESP Templates are web pages that allow you to determine what goes into the web page at runtime.
|
|
Whereas static HTML web pages must be fixed at development time, ESP template pages can embed HTML
|
|
and data at runtime and on a per-user basis. While there are many different ways to render data at
|
|
runtime, ESP provides one of the easiest and most powerful template frameworks without compromising
|
|
speed or memory footprint.</p>
|
|
<!-- MOB rethink -->
|
|
<p>The ESP templating solution provides powerful embedding of "C" code in web pages, transparent compilation,
|
|
caching of code and responses and a rich library of HTML controls to quickly generate dynamic tables,
|
|
tabs, lists, input forms and more. These are integrated with the jQuery client-side library for rich,
|
|
client side processing and Ajax support.</p>
|
|
|
|
<a id="embedded"></a>
|
|
<h2 class="section">Embedded C Code </h2>
|
|
<p>ESP templates are essentially HTML pages with embedded "C" code that are parsed into pure "C"
|
|
code and then compiled into native machine code for exceptionally fast execution. </p>
|
|
|
|
<pre>
|
|
<h1>Hello World</h1>
|
|
<h2>Today is <%= mprGetDate(0); %></h2>
|
|
</pre>
|
|
|
|
<h3>Why "C"?</h3>
|
|
<p>Why "C" code, you may ask? Because we wanted ESP to provide the ultimate in speed and efficiency.
|
|
"C" is the fastest, closest to the hardware, language available. By using "C", invoking device APIs
|
|
and other system APIs are easy, fast and compact. There is no translation or coupling required getting
|
|
into and out of another language.</p>
|
|
<p> To enhance the ESP development environment, ESP adds a rich library of HTML controls, and garbage
|
|
collection for managing memory. This makes working with "C" embedded web pages, expressive and productive.</p>
|
|
|
|
<h3>Transparent Compiling</h3>
|
|
<p>ESP web pages are parsed and converted into "C" code including all HTML and embedded "C". The result is
|
|
then compiled and optimized into a native code shared library module.
|
|
Once compiled, the module is cached in-memory and saved on disk and when required, is loaded into
|
|
memory for execution. Once loaded, subsequent requests will use the in-memory
|
|
code without any access to the original template web page. If the system is rebooted, the on-disk
|
|
cached module will be loaded without recompilation.</p>
|
|
|
|
<p>The compilation of ESP pages happens
|
|
automatically and quickly in the background when in development mode. If the original web page
|
|
is modified, the page is transparently recompiled and re-cached. For production, pages can be pre-compiled,
|
|
and locked-down without recompiling in the field. This updating behavior can be controlled by the
|
|
<em><a href="../../appweb/users/dir/esp.html#espUpdate">EspUpdate</a></em> configuration directive.</p>
|
|
<img src="../../../images/esp/template/compile.jpeg" alt="compile" />
|
|
<a id="configuration"></a>
|
|
<h2 class="section">Configuration</h2>
|
|
<p>The <em>appweb.conf</em> configuration file controls how ESP compiles and links template pages into
|
|
modules. It does this via special ESP configuration directives.</p>
|
|
<p>Each Appweb <a href="../../appweb/users/routing.html">Route</a> may contain a unique set of ESP
|
|
directives, or it may inherit the configuration from the default or outer routes.</p>
|
|
|
|
<p>The standard appweb.conf includes an ESP configuration file <em>esp.conf</em> that contains
|
|
default ESP compilation and link command lines for each operating system. On Unix based systems, the
|
|
<em>esp.conf</em> file is located at
|
|
<em>/usr/lib/appweb/lib/esp.conf</em>. On windows systems, this will be located at
|
|
<em>/Program Files/Embedthis Appweb/lib/esp.conf</em>. You may need to customize this file to suit your
|
|
system or compilation environment.</p>
|
|
<h3>ESP Configuration Directives</h3>
|
|
<ul>
|
|
<li><a href="../../appweb/users/dir/esp.html#espDir">EspDir</a> — This defines the directories that
|
|
ESP will search and use when compiling template pages. </li>
|
|
<li><a href="../../appweb/users/dir/esp.html#espCompile">EspCompile</a> — This defines the
|
|
commandline used to compile template pages and controllers.</li>
|
|
<li><a href="../../appweb/users/dir/esp.html#espLink">EspLink</a> — This defines the
|
|
commandline used to link template pages and controllers as shared libraries.</li>
|
|
<li><a href="../../appweb/users/dir/esp.html#espEnv">EspEnv</a> — This defines environment
|
|
variables required when running the compile and link commands.</li>
|
|
<li><a href="../../appweb/users/dir/esp.html#espUpdate">EspUpdate</a> — This controls if ESP
|
|
will automatically reload modified modules and transparently recompiled modified ESP source template
|
|
pages.</li>
|
|
</ul>
|
|
<a id="layouts"></a>
|
|
<h2 class="section">Layouts — Creating a Consistent Look and Feel</h2>
|
|
<p>Highly usable applications have consistent structure, menus and appearance so the user can easily
|
|
navigate that application. Such applications typically consist of many web pages that share a common look
|
|
and feel. However, designing and maintaining that consistency is sometimes a challenge.</p>
|
|
|
|
<p>ESP Templates provide a powerful and flexible solution for implementing a consistent UI.
|
|
ESP template pages use layout pages that define the look and feel of an application. Content pages are then
|
|
rendered by merging with one or more layout pages that define the look and feel of the application.
|
|
This creates a composite page that is what the user will actually see. In this way, a web application
|
|
can easily maintain a consistent look and feel without repeating boilerplate code from page to page.
|
|
ESP believes strongly in the DRY principle: <em>"Don't Repeat Yourself"</em>. Web page parts that are
|
|
repeated from page to page are centralized in ESP applications into layout pages and are not repeated in
|
|
each content page.</p>
|
|
|
|
<img src="../../../images/esp/template/layout.jpeg" alt="layout" />
|
|
<p>For example: this is a layout page called "<em>layouts/default.ejs</em>" that defines the top level HTML
|
|
content for all content pages. It has a banner image and division tags that structure the page:</p>
|
|
<pre>
|
|
<html>
|
|
<body>
|
|
<div class="top">
|
|
<img src="banner.jpg" />
|
|
</div>
|
|
<div class="content">
|
|
<b><%@ content %></b>
|
|
</div>
|
|
</body>
|
|
</html>
|
|
</pre>
|
|
<p>Modifications to this page, will be reflected automatically in all content pages.</p>
|
|
|
|
<a id="content"></a>
|
|
<h3>Content Pages</h3>
|
|
<p>A content page defines only the HTML and code that is unique for a specific page. It is merged with a
|
|
layout page by inserting the content and replacing the <em><%@ content %></em> tag in the master
|
|
page.</p>
|
|
<p>For example, consider the content page named "<em>views/demo-index.esp</em>":</p>
|
|
<pre>
|
|
<b><h1>Content Page</h1>
|
|
<p>Hello World</p></b>
|
|
</pre>
|
|
<p>This would render a composite web page back to the user:</p>
|
|
<pre>
|
|
<html>
|
|
<body>
|
|
<div class="top">
|
|
<img src="banner.jpg" />
|
|
</div>
|
|
<div class="content">
|
|
<b><h1>Content Page</h1>
|
|
<p>Hello World</p></b>
|
|
</div>
|
|
</body>
|
|
</html>
|
|
</pre>
|
|
<a id="alternateLayout"></a>
|
|
<h3>Alternate Layout Pages</h3>
|
|
<p>A content page can request a specific layout page by using the <em><%@ layout "file"></em>
|
|
directive.</p>
|
|
<pre>
|
|
<b><%@ layout "alternateLayout.esp"></b>
|
|
<h1>Content Page</h1>
|
|
<p>Hello World</p>
|
|
</pre>
|
|
<p>This instructs the templating engine to use the "alternateLayout.esp" file rather than the default
|
|
layout. The default layout page is called "layouts/default.esp". </p>
|
|
|
|
<a id="multiple"></a>
|
|
<h3>Multiple Layout Pages</h3>
|
|
<p>You are not restricted to a simple two level layout and content page scheme. A layout page can itself
|
|
refer to another layout page to gradually build up the application's look and feel. To do this, the layout
|
|
page needs to include an explicit <em><%@ layout "file"></em> directive.</p>
|
|
<a id="paradigms"></a>
|
|
<h2 class="section">Application Paradigms</h2>
|
|
<p>ESP supports two primary application paradigms:
|
|
<ul>
|
|
<li>Stand-alone Web Page</li>
|
|
<li>Model View Controller</li>
|
|
</ul>
|
|
<h3>Model View Controller Applications</h3>
|
|
<p>The Model View Controller (MVC) paradigm is characterized by Controller actions that are invoked
|
|
when client HTTP requests are received. The controller responds to the request and determines what action
|
|
will be taken including what view (if any) will be rendered back to the client. The controller manages the
|
|
flow of execution for the application and is stored under the "<em>controllers</em>" directory. ESP
|
|
templates in an MVC application are called Views and are stored under the "<em>views</em>" directory. These
|
|
views utilize template layout pages from the "<em>layouts</em>" directory. The <em>esp</em> utility
|
|
command is typically used to generate and manage ESP MVC applications.</p>
|
|
<h3>Stand-Alone Page Applications</h3>
|
|
<p>The Stand-alone application paradigm is characterized by individual ESP template pages that do not
|
|
have controllers. They may utilize template layout pages, but application controller logic is held
|
|
within the page itself. These applications typically use a "Post-Back" paradigm where a form will post back
|
|
to the same page that was used to render the form.</p>
|
|
|
|
<a id="dir"></a>
|
|
<h2 class="section">Directory Structure</h2>
|
|
<p>ESP follows the <a href="http://en.wikipedia.org/wiki/Convention_over_Configuration">Convention
|
|
over Configuration</a> design paradigm where developers only need to specify the unusual parts of their
|
|
application. This is exemplified by an expected directory structure for views and layouts.</p>
|
|
<pre>
|
|
+-- cache
|
|
|
|
|
+ Cached modules for controllers and template web pages
|
|
+-- controllers
|
|
|
|
|
+ MVC Controller files
|
|
+-- db
|
|
|
|
|
+ Database files
|
|
+-- layouts
|
|
|
|
|
+ Layout pages...
|
|
+-- static
|
|
|
|
|
+ Static web pages (and stand-alone ESP pages)
|
|
+--views
|
|
|
|
|
+ MVC View pages...
|
|
</pre>
|
|
<p>For ESP MVC applications, The <a href="generator.html"><b>esp</b></a> application generator
|
|
program will create these directories for you when you run</p>
|
|
<pre>
|
|
esp generate app appName
|
|
</pre>
|
|
<p>After creating the application, you should name views using the form:
|
|
<pre>
|
|
views/CONTROLLER-VIEW.esp
|
|
</pre>
|
|
The view name should all be lower case.
|
|
<a id="directives"></a>
|
|
<h2 class="section">ESP Page Directives</h2>
|
|
<p>The following directives are provided:</p>
|
|
<table title="directives">
|
|
<thead>
|
|
<tr>
|
|
<th>Directive</th>
|
|
<th>Purpose</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><%@ include "file" %></td>
|
|
<td>Include the named file at this location</td>
|
|
</tr>
|
|
<tr>
|
|
<td><%@ layout "file" %></td>
|
|
<td>Use the specified layout file for this page</td>
|
|
</tr>
|
|
<tr>
|
|
<td><%@ content %></td>
|
|
<td>Used in layout pages to specify where the content should be inserted </td>
|
|
</tr>
|
|
<tr>
|
|
<td><%^ global ...</td>
|
|
<td>Specify that the code from this block must be at a "global" C scope. This is useful
|
|
for global declarations, extern statements and #include statements.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><%^ start ...</td>
|
|
<td>Specify that the code from this block will be positioned at the start of the
|
|
generated function for the template. This is useful for local variable declarations.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><%^ end ...</td>
|
|
<td>Specify that the code from this block will be positioned at the end of the
|
|
generated function for the template.</td>
|
|
<tr>
|
|
<td><%= expression %></td>
|
|
<td>"C" expression</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="nowrap"><%= [%fmt] expression %></td>
|
|
<td>Formatted "C" expression. The expression is passed through a "printf" style formatter.
|
|
Use "%S" for HTML-escaped safe strings.</td>
|
|
</tr>
|
|
<tr>
|
|
<td><% statements %></td>
|
|
<td>"C" statements</td>
|
|
</tr>
|
|
<tr>
|
|
<td><-%></td>
|
|
<td>Trim the trailing newline for the generated block</td>
|
|
</tr>
|
|
<tr>
|
|
<td>@@variable</td>
|
|
<td>Request parameter or session variable. This is equivalent to "<em>renderVar(variable)</em>"</td>
|
|
</tr>
|
|
<tr>
|
|
<td>@!variable</td>
|
|
<td>C string variable</td>
|
|
</tr>
|
|
<tr>
|
|
<td>@#field</td>
|
|
<td>Record field variable. This is equivalent to "<em>ediGetField(getRec(), field))</em>"</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<h3><%@ include "file" %></h3>
|
|
<p>This directive can be used to include other HTML or ESP files at this location. The included
|
|
contents will be parsed as an ESP page and the results substituted at this location. ESP include
|
|
directives can be nested to an arbitrary depth.</p>
|
|
<h3><%@ layout "file" %></h3>
|
|
<p>The layout directive specifies the filename of the layout page to use. If set to the empty string <em>""</em>
|
|
then no layout page will be used. The default layout page is <em>layouts/default.esp</em></p>
|
|
<h3><%@ content %></h3>
|
|
<p>This directive is used only in layout pages to specify where the content page should be inserted.
|
|
There should be only one such directive in a layout page.</p>
|
|
<h3><%^ global ....</h3>
|
|
<p>This directive specifies that the code from this block must be at a "global" C scope. This is useful
|
|
for global declarations, extern statements and #include statements.</p>
|
|
<h3><%^ start ...</h3>
|
|
<p>This directive specifies that the code from this block will be positioned at the start of the
|
|
generated function for the template. Some "C" compilers do not allow variable declarations to be placed other
|
|
than at the start of a block. So this directive is useful for local variable declarations.</p>
|
|
<h3><%^ end ...</h3>
|
|
<p>This directive specifies that the code from this block will be positioned at the end of the
|
|
generated function for the template.</p>
|
|
<h3><%= expression %></h3>
|
|
<p>Use this directive to embed the result of a "C" expression. The result must be a null-terminated string.
|
|
This example below calls the
|
|
<a href="../../../api/mpr.html#mpr_8h_1a8ecdc6cb45d8758203e09764faaf5e2d">mprGetDate</a>
|
|
function which returns the local date and time as a string.</p>
|
|
<pre>
|
|
Today is <%= mprGetDate(0); %><
|
|
</pre>
|
|
<p>Note that the string returned from mprGetDate was not freed. This is because Appweb and ESP use a
|
|
<a href="../../../ref/appweb/memory.html#collector">Garbage Collection</a> and so such returned data does
|
|
not need to be freed. This permits the use of a chaining style of programming where the outputs of one
|
|
function can be used as arguments to others. For example:
|
|
<pre>Resource name: <%= mprJoinExt(mprJoinPath(dir, supper(name)), "jpg") %> </pre>
|
|
<h3><% statements %></h3>
|
|
<p>Use this directive to run "C" code statements. No value is substituted back into the page in
|
|
place of the directive. If you need to write data inside a statement block, use the
|
|
<!--MOB-->
|
|
render API.</p>
|
|
<pre>
|
|
<%
|
|
for (i = 0; i < 10; i++) {
|
|
render("I is %d <br/>\n", i);
|
|
}
|
|
%>
|
|
</pre>
|
|
<!-- MOB links -->
|
|
<p><em>Security Note</em>: you should never use <em>render</em> to write back user data that has not been
|
|
validated. If you
|
|
must render user input data, use <em>renderSafe</em> which will escape any HTML sequences. This is essential
|
|
to avoid XSS and other security issues.</p>
|
|
<p>You can also iterate over regular HTML code. The following code will display <b>Hello World</b> ten
|
|
times in the web page.</p>
|
|
<pre>
|
|
<% for (i = 0; i < 10; i++) { %>
|
|
Hello World
|
|
<% } %>
|
|
</pre>
|
|
<h3>@@variables</h3>
|
|
<p>ESP provides a shorthand for accessing request parameters. Request parameters are a collection of
|
|
query variables, posted form fields, routing tokens, session variables and any explicitly set parameters.
|
|
These are stored in a params table and in session data stores and are accessible via the
|
|
<a href="../../../api/esp.html#group___esp_abbrev_1gad638c34898123293ebc120c1f9396a9c">param</a>,
|
|
<a href="../../../api/esp.html#group___esp_req_1ga98e63a9a924ec667a3c1b540e56792d3">espGetParam</a> and
|
|
<a href="../../../api/esp.html#group___esp_session_1ga60a5effb2a9ef53fdb02dbe865bf6093">espGetSession</a>
|
|
APIs. However,
|
|
the <em>@@variable</em> directive provides an easier way. With this directive, the params and session data
|
|
are examined (in that order) for the given variable name.
|
|
<p>In this example below if the URI: <em>http://example.com/test.esp?name=John</em> was used the following ESP
|
|
template could be used to access the "<em>name</em>" query value.
|
|
<pre>
|
|
<h2>My name is <b>@@name</b></h2>
|
|
</pre>
|
|
<p>This directive is very useful for accessing any request, form, query or session data.</p>
|
|
<h3>@!variables</h3>
|
|
<p>ESP provides a shorthand for accessing C string variables inline.
|
|
<pre>
|
|
<%^start
|
|
char *weather = "fine";
|
|
%>
|
|
<h2>Current weather is <b>@!fine</b></h2>
|
|
</pre>
|
|
<p>This is equivalent to:</p>
|
|
<pre>
|
|
<%= fine %>
|
|
</pre>
|
|
<h3>@#field</h3>
|
|
<p>ESP provides a shorthand for accessing field data in the current database record. Controllers will
|
|
often setup the environment for a view by defining a "current" database record.
|
|
The <em>@#field</em> directive provides an easy way to access any field in the current record.
|
|
<p>If a controller defined a current "<em>user</em>" record, this example below would extract the
|
|
"<em>name</em>" field for display.
|
|
<pre>
|
|
<h2>My name is <b>@#name</b></h2>
|
|
</pre>
|
|
<a id="context"></a>
|
|
<h2 class="section">Request Context </h2>
|
|
<p>The full HTTP request context is provided by a set of objects. These include:
|
|
<ul>
|
|
<li>Request Params — Request query and form data</li>
|
|
<li>Session Data — Persistent session data saved across requests</li>
|
|
<li><a href="../../../api/http.html#group___http_conn">HttpConn</a> — Connection object. Holds data pertaining to the socket connection.</li>
|
|
<li><a href="../../../api/http.html#group___http_rx">HttpRx</a> — Receive object. Holds data pertaining to this HTTP request.</li>
|
|
<li><a href="../../../api/http.html#group___http_tx">HttpTx</a> — Transmit object. Holds data pertaining to the response for this request.</li>
|
|
<li><a href="../../../api/http.html#group___http_host">HttpHost</a> — Host object. Holds data for the host/virtual host serving the request.</li>
|
|
<li><a href="../../../api/http.html#group___http_route">HttpRoute</a> — Route object. Holds details regarding the route managing the request.</li>
|
|
<li>EspRoute — Additional ESP specific route state</li>
|
|
<li>EspReq — Additional ESP specific request state</li>
|
|
</ul>
|
|
<p>The Rx, Tx, Host, Route, EspRoute and EspReq objects are all addressable from the Conn object.
|
|
<p>Here is a collection of especially useful context items:</p>
|
|
<table title="items">
|
|
<tr><td>getConn()</td><td>Get the current connection object. Can be used inside controllers and
|
|
template web pages</td></tr>
|
|
<tr><td>conn->rx</td><td>Request object</td>
|
|
<tr><td>conn->tx</td><td>Transmit object</td>
|
|
<tr><td>conn->host</td><td>Host object</td>
|
|
<tr><td>conn->route</td><td>Route object</td>
|
|
<tr><td>rx->method</td><td>HTTP method string</td>
|
|
<tr><td>rx->uri</td><td>Request URI</td>
|
|
<tr><td>rx->pathInfo</td><td>Request path information after the scriptName</td>
|
|
<tr><td class="nowrap">rx->scriptName</td><td>Script name portion of the request URI</td>
|
|
<tr><td>tx->filename</td><td>Resource filename being served</td>
|
|
<tr><td>tx->ext</td><td>Resource filename extension</td>
|
|
<tr><td>tx->finalized</td><td>Set if response output has been completed</td>
|
|
<tr><td>route->dir</td><td>Document root directory for the route</td>
|
|
</table>
|
|
<p>See the <a href="../../../api/native.html">Native APIs</a> document for more details about the available
|
|
APIs.</p>
|
|
|
|
<a id="compilation"></a>
|
|
<h2 class="section">Compilation</h2>
|
|
<p>When developing, ESP will automatically detect changes made to the applications code and will
|
|
intelligently recompile the necessary portions of the application. You can manually force a recompilation
|
|
via the <em>esp</em> command.</p>
|
|
<pre>
|
|
esp compile
|
|
</pre>
|
|
<p>See the <a href="generator.html">Application Generator</a> documentation for full details.</p>
|
|
<!-- MOB
|
|
<h2 class="section">Common Tasks</h2>
|
|
<h3>Managing Links</h3>
|
|
<h3>Writing Data</h3>
|
|
<h3>Redirecting</h3>
|
|
<h3>Setting the HTTP Resposne Code</h3>
|
|
<h3>Adding a HTTP Header</h3>
|
|
-->
|
|
<a id="debugging"></a>
|
|
<h2 class="section">Debugging</h2>
|
|
<p>You can inject debugging code into your views to trace data to the appweb log file or back to the client's
|
|
browser.</p>
|
|
<!-- MOB links for render -->
|
|
<p>The <a href="../../../api/mpr.html#group___mpr_log_1ga21fa2199e7f70707c1fb3b63daed6ecf">mprLog</a>
|
|
function will print its arguments to appweb log file.
|
|
<p>To send trace to the browser, use the <em>render</em> method to write data back to the browser.
|
|
|
|
<a id="controls"></a>
|
|
<h2 class="section">HTML Controls</h2>
|
|
<p>ESP provides a rich set of HTML controls that can be used inside template pages and controllers to
|
|
generate HTML components. Some of the important controls and functions are:</p>
|
|
<table title="controls">
|
|
<thead>
|
|
<tr>
|
|
<th>Control Name</th>
|
|
<th>Description</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>anchor</td>
|
|
<td>Emit an anchor link</td>
|
|
</tr>
|
|
<tr>
|
|
<td>chart</td>
|
|
<td>Emit a graphic chart</td>
|
|
</tr>
|
|
<tr>
|
|
<td>endform</td>
|
|
<td>End an input form</td>
|
|
</tr>
|
|
<tr>
|
|
<td>flash</td>
|
|
<td>Emit a flash message area field</td>
|
|
</tr>
|
|
<tr>
|
|
<td>form</td>
|
|
<td>Emit a HTML form</td>
|
|
</tr>
|
|
<tr>
|
|
<td>format</td>
|
|
<td>Format data according to a format renderer function</td>
|
|
</tr>
|
|
<tr>
|
|
<td>link</td>
|
|
<td>Make a URI link for an action and controller</td>
|
|
</tr>
|
|
<tr>
|
|
<td>progress</td>
|
|
<td>Emit a progress bar</td>
|
|
</tr>
|
|
<tr>
|
|
<td>redirect</td>
|
|
<td>Redirect the client to a new URL</td>
|
|
</tr>
|
|
<!-- MOB renderSafe -->
|
|
<tr>
|
|
<td>render</td>
|
|
<td>Render a data back to the client</td>
|
|
</tr>
|
|
<!-- MOB
|
|
<tr>
|
|
<td>renderFile</td>
|
|
<td>Render a file back to the client</td>
|
|
</tr>
|
|
-->
|
|
<tr>
|
|
<td>renderView</td>
|
|
<td>Render a specified view to the client</td>
|
|
</tr>
|
|
<!--
|
|
<tr>
|
|
<td>setCookie</td>
|
|
<td>Create a cookie to send to the client</td>
|
|
</tr>
|
|
<tr>
|
|
<td>setHeader</td>
|
|
<td>Set a HTTP response header</td>
|
|
</tr>
|
|
<tr>
|
|
<td>setHttpCode</td>
|
|
<td>Set the HTTP response code</td>
|
|
</tr>
|
|
<tr>
|
|
<td>setMimeType</td>
|
|
<td>Set the response mime type</td>
|
|
</tr>
|
|
-->
|
|
<tr>
|
|
<td>table</td>
|
|
<td>Render a smart table</td>
|
|
</tr>
|
|
<tr>
|
|
<td>text</td>
|
|
<td>Render a text input area</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<!-- BeginDsi "dsi/bottom.html" -->
|
|
<div class="bottom">
|
|
<p class="footnote">
|
|
<a href="../../../product/copyright.html" >© Embedthis Software LLC, 2003-2013.
|
|
All rights reserved. Embedthis, Appweb, ESP, Ejscript and Embedthis GoAhead are trademarks of Embedthis Software LLC.</a>
|
|
</p>
|
|
</div>
|
|
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
|
|
<script type="text/javascript">
|
|
google.load('search', '1', {language : 'en'});
|
|
google.setOnLoadCallback(function() {
|
|
var customSearchControl = new google.search.CustomSearchControl(
|
|
'000262706376373952077:1hs0lhenihk');
|
|
customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
|
|
var options = new google.search.DrawOptions();
|
|
options.enableSearchboxOnly("http://appwebserver.org/search.html");
|
|
customSearchControl.draw('cse-search-form', options);
|
|
}, true);
|
|
</script>
|
|
<script type="text/javascript">
|
|
var _gaq = _gaq || [];
|
|
_gaq.push(['_setAccount', 'UA-179169-2']);
|
|
_gaq.push(['_trackPageview']);
|
|
(function() {
|
|
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
|
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
|
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html>
|