123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <title>Javascript Templates</title>
- <!-- Copyright Embedthis Software. All Rights Reserved. -->
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <meta charset="utf-8" />
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
- <meta name="description" content="Simple, fast, secure embedded web server" />
- <link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Open+Sans:300italic,400,300,700'
- rel='stylesheet' type='text/css'>
- <link href='https://fonts.googleapis.com/css?family=Julius+Sans+One' rel='stylesheet' type='text/css'>
-
- <link href="../images/favicon.ico" rel="shortcut icon" />
- <link href="../lib/semantic-ui/semantic.min.css" rel="stylesheet" type="text/css" />
- <link href="../css/all.min.css" rel="stylesheet" type="text/css" />
- <link href="../css/api.min.css" rel="stylesheet" type="text/css" />
-
- </head>
- <body class="show-sidebar">
- <div class="sidebar">
- <div class="ui large left vertical inverted labeled menu">
- <div class="item">
- <a href="../" class="logo">GoAhead Docs</a>
- </div>
- <div class="item">
- <a href="../">
- <b>General</b>
- </a>
- <div class="menu">
- <a class="item" href="../">GoAhead Overview</a>
- <a class="item" href="../users/features.html">GoAhead Features</a>
- <a class="item" href="https://embedthis.com/goahead/download.html">Download</a>
- <a class="item" href="../licensing/">Licensing</a>
- </div>
- </div>
- <div class="item">
- <a href="../start/">
- <b>Getting Started</b>
- </a>
- <div class="menu">
- <a class="item" href="../start/quick.html">Quick Start</a>
- <a class="item" href="../start/installing.html">Installing GoAhead</a>
- <a class="item" href="../start/running.html">Running GoAhead</a>
- <a class="item" href="../start/releaseNotes.html">Release Notes</a>
- <a class="item" href="../start/faq.html">GoAhead FAQ</a>
- <a class="item" href="../start/source.html">Building from Source</a>
- </div>
- </div>
- <div class="item">
- <a href="../users/"><b>User's Guide</b></a>
- <div class="menu">
- <a class="item" href="../users/ports.html">Ports and Binding</a>
- <a class="item" href="../users/routing.html">Routing Requests</a>
- <a class="item" href="../users/handlers.html">Request Handlers</a>
- <a class="item" href="../users/js.html">Embedded Javascript</a>
- <a class="item" href="../users/jst.html">Javascript Templates</a>
- <a class="item" href="../users/goactions.html">GoActions</a>
- <a class="item" href="../users/cgi.html">CGI Programs</a>
- <a class="item" href="../users/authentication.html">User Authentication</a>
- <a class="item" href="../users/logFiles.html">Log Files</a>
- <a class="item" href="../users/ssl.html">Secure Sockets (SSL)</a>
- <a class="item" href="../users/security.html">Security Considerations</a>
- <a class="item" href="../users/man.html">Man Pages</a>
- </div>
- </div>
- <div class="item">
- <a href="../developers/">Developer's Guide</a>
- <div class="menu">
- <a class="item" href="../developers/embedding.html">Embedding GoAhead</a>
- <a class="item" href="../developers/handlers.html">Creating GoAhead Handlers</a>
- <a class="item" href="../developers/authstore.html">Creating Password Verifiers</a>
- <a class="item" href="../developers/migrating.html">Migrating to GoAhead 3</a>
- <a class="item" href="../developers/rom.html">Serving Pages from ROM</a>
- </div>
- </div>
- <div class="item">
- <a href="../ref/">Reference Guide</a>
- <div class="menu">
- <a class="item" href="../ref/compatibility.html">Compatibility</a>
- <a class="item" href="../ref/native.html">API Library</a>
- <a class="item" href="../ref/architecture.html">GoAhead Architecture</a>
- <a class="item" href="../standards/http.html">HTTP References</a>
- </div>
- </div>
- <div class="item">
- <a href="../developers/project.html">Project Resources</a>
- <div class="menu">
- <a class="item" href="http://goo.gl/IGbiio">Official GoAhead News</a>
- <a class="item" href="https://embedthis.com/goahead/">GoAhead Web Site</a>
- <a class="item" href="https://github.com/embedthis/goahead">Source Code Repository</a>
- <a class="item" href="https://github.com/embedthis/goahead/issues/99">GoAhead Security Alerts</a>
- <a class="item" href="https://github.com/embedthis/goahead/issues">Project Issue Database</a>
- <a class="item" href="https://github.com/embedthis/goahead/releases">Change Log</a>
- <a class="item" href="https://github.com/embedthis/goahead/milestones">Roadmap</a>
- <a class="item" href="https://embedthis.com/developers/contributors.html">Contributors Agreement</a>
- </div>
- </div>
- <div class="item">
- <b>Links</b>
- <div class="menu">
- <a class="item" href="https://embedthis.com/">Embedthis Web Site</a>
- <a class="item" href="https://embedthis.com/blog/">Embedthis Blog</a>
- <a class="item" href="http://twitter.com/embedthat">Twitter</a>
- </div>
- </div>
- </div>
- </div>
- <div class="ui inverted masthead">
- <div class="ui fixed inverted menu">
- <div class="ui sidebar-launch button">
- <i class="icon list layout"></i>
- </div>
- <div class="right menu">
- <a class="item" href="https://embedthis.com/">Embedthis</a>
- <a class="item" href="https://embedthis.com/goahead/">GoAhead Site</a>
- <span class="desktop-only">
- <a class="item" href="http://goo.gl/9bL9rM">GoAhead News</a>
- <a class="item" href="https://github.com/embedthis/goahead">Repository</a>
- <a class="item" href="https://embedthis.com/blog/">Blog</a>
- <a class="item" href="https://twitter.com/embedthat">Twitter</a>
- </span>
- </div>
- </div>
-
- <div class="ui breadcrumb">
- <a class="section" href="../">Home</a>
-
- <div class="divider">/</div>
- <a class="section" href="../users/">
- User's Guide
- </a>
-
-
- <div class="divider">/</div>
- <a class="active section" href="jst.html">Javascript Templates</a>
-
- </div>
-
- <iframe class="version desktop-only" src="../version.html"></iframe>
- </div>
- <div class="content">
- <h1>Javascript Templates (JST)</h1>
- <p>Javascript Templates (JST) enable the easy creation of dynamic web pages and applications.
- Javascript Templates are HTML web pages that execute <a href="js.html">Embedded Javascript</a> on
- the server before rendering the page back to the client.
- JST is an extensible environment and allows the direct binding of C functions to Javascript functions, so that a JST web page can easily access device or system data.</p>
- <h2>JST Handler</h2>
- <p>A JST document has a <i>.jst</i> extension and is processed by the <i>jst</i> handler. The JST handler executes JST scripts and replaces them with the corresponding script results. The user sees a normal HTML page, but it is one that was dynamically created by the JST handler.</p>
- <h2>JST Delimiters</h2>
- <p>To create a JST script field in a JST document, use the <i><%</i> and <i>%></i> delimiters.
- For example, the following
- JavaScript will output "Hello World" in place of the JST-delimited field:</p>
- <pre class="ui code segment">Today is <% write("Hello" + " World"); %></pre>
- <h2>Scripting Execution</h2>
- <p>When a user's browser requests a JST document, the JST handler is invoked to serve the request.
- The JST document is read from the file system in a one-pass operation. Text in the document
- before JST delimiters is copied directly to the client. If JST delimiters are found, the script between the delimiters is executed and the resulting text is written to the client. The process continues until the end of the document.</p>
- <h2>Standard Functions</h2>
- <p>JST defines one standard function: <i>write</i>. This function writes data back to the client in
- the place of the JST script.</p>
- <h2>Defining JST functions</h2>
- <p>New JST functions can be created via
- <a href="../ref/api/goahead.html#group___webs_1gaafb69f988b3093c4981fd7bc94f1a42a">websDefineJst</a>.
- This binds a C function to a Javascript function. For example:
- <pre class="ui code segment">
- static getDate(int jid, Webs *wp, int argc, char **argv) {
- char *date = websGetDate(0);
- websWrite(wp, "%s", date);
- gfree(date);
- }
- <b>websDefineJst("date", getDate);</b></pre>
- <p>Once defined, JST pages can use the new <i>date</i> function:
- <pre class="ui code segment">
- Today's date is: <% <b>date();</b> %>
- </pre>
- </div>
- <div class="terms ui basic center aligned segment">
- <p>© Embedthis Software, 2003-2015. All rights reserved.</p>
- </div>
- <script src="../lib/jquery/jquery.min.js"></script>
- <script src="../lib/semantic-ui/semantic.min.js"></script>
- <script src="../scripts/sidebar.min.js"></script>
-
-
- </body>
- </html>
|