UNPKG

processmaker-builder

Version:

The gulp task runner for ProcessMaker building

335 lines (248 loc) 21.5 kB
<!DOCTYPE html> <html> <head> <title>Luracast Restler 3 Live Examples:- Forms Example</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link rel="stylesheet" type="text/css" href="../resources/bootstrap.min.css" /> <link rel="stylesheet" type="text/css" href="../resources/highlight.css" /> <link rel="stylesheet" type="text/css" href="../resources/style.css" /> <link rel="stylesheet" type="text/css" href="../resources/facebox.css" /> <link rel="stylesheet" type="text/css" href="../resources/hacks.css" /> <script type="text/javascript" src="../resources/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="../resources/facebox.js"></script> <script type="text/javascript" src="../resources/bootstrap.min.js"></script> <script type="text/javascript" src="../resources/highlight.pack.js"></script> <script type="text/javascript"> $(document).ready( function() { $('dd pre code').each(function(i, e) { text = $(e).text(); $(e).addClass(text.charAt(0) == '<' ? 'xml' : 'json') //hljs.highlightBlock(e); }); $('pre code').each(function(i, e) { if($(e).attr('class')) hljs.highlightBlock(e); }); $('abbr').parents().not('a').children('abbr').click( function() { $('#codeviewer').load( '../resources/getsource.php?file=' + $(this).attr("title"), function() { /* $("pre#php").snippet("php", { style : "acid", showNum : false }); */ jQuery.facebox({ div : '#codeviewer' }); hljs.highlightBlock($("pre#php")[1]); }); }); var curURL = window.location.pathname.split('/examples/')[1]; if (curURL == '') curURL = 'index.html'; $("a").each(function() { if ($(this).attr("href") && $(this).attr("href").indexOf(curURL) > -1) { $(this).addClass("active"); } }); $('#right tag').popover({ html : true, placement : 'left', trigger : 'manual', title : 'Tagged Examples', content : '...' }).click(function(e) { $('#right tag').popover('hide'); $(this).popover('show'); e.preventDefault(); e.stopPropagation ? e.stopPropagation() : e.cancelBubble = true; }); $(document).click(function(e) { $('#right tag').popover('hide'); }); }) </script> <!--[if lte IE 8]> <script type="text/javascript"> (function(){if(!/*@cc_on!@*/0)return;var e = "abbr,article,aside,audio,bb,canvas,datagrid,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video,tag".split(',');for(var i=0;i<e.length;i++){document.createElement(e[i])}})() </script> <![endif]--> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-23777019-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> </head> <body> <nav class="floating-menu"> <ul> <li><a title="Restler Home" target="_blank" href="http://luracast.com/products/restler/"><img src="../resources/home.png" width="16" height="16"/> Home</a></li> <li><a title="Getting Started with Restler" href="../.."><img src="../resources/quickstart.png" width="16" height="16"/> Start</a></li> <!--<li><a title="Using Restler" href="#">Guide</a></li><li><a title="Restler API Reference" href="#">API</a></li>--> <li><a class="active" href="../index.html"><img src="../resources/examples.png" width="16" height="16"/> Examples</a></li> <li><a title="Share your knowledge by answering user questions in Stack Overflow." target="_blank" href="http://bit.ly/Restler-QA"><img src="../resources/stackoverflow.png" width="16" height="16"/> Support</a></li> <li><a title="Contribute and Fork Restler on GitHub" target="_blank" href="http://bit.ly/LuracastRestler"><img src="../resources/github.png" width="16" height="16"/> Source</a></li> <li><a title="Get updated on Twitter" target="_blank" href="http://twitter.com/Luracast"><img src="../resources/twitter.png" width="16" height="16"/> Update</a></li> <li><a title="Keep in touch on Facebook" target="_blank" href="https://www.facebook.com/Luracast"><img src="../resources/facebook.png" width="16" height="16"/> Connect</a></li> </ul> </nav> <div id="codeviewer" style="display: none;"></div> <nav id="left"> <img src="../resources/Restler3.gif" width="126" height="126" title="Luracast Restler 3" /> <h3> <a href="../index.html">Examples</a> </h3> <ul> <li><a href="../_001_helloworld/readme.html" title="Let's say hello!">Hello World</a></li> <li><a href="../_002_minimal/readme.html" title="Less is more">Minimal</a></li> <li><a href="../_003_multiformat/readme.html" title="Serving what the client wants">Multi-format</a></li> <li><a href="../_004_error_response/readme.html" title="Making use of HTTP status codes">Error Response</a></li> <li><a href="../_005_protected_api/readme.html" title="Creating restricted zone">Protected API</a></li> <li><a href="../_006_routing/readme.html" title="Ways to map api methods to url">Routing</a></li> <li><a href="../_007_crud/readme.html" title="using POST, GET, PUT and DELETE">CRUD</a></li> <li><a href="../_008_documentation/readme.html" title="Commenting can be more rewarding">Documentation</a></li> <li><a href="../_009_rate_limiting/readme.html" title="Abuse no more">Rate Limiting</a></li> <li><a href="../_010_access_control/readme.html" title="Who can do what">Access Control</a></li> <li><a href="../_011_versioning/readme.html" title="using the URL">Versioning</a></li> <li><a href="../_012_vendor_mime/readme.html" title="custom media type for versioning">Vendor MIME</a></li> <li><a href="../_013_html/readme.html" title="rendering custom views">Html Format</a></li> <li><a href="../_014_oauth2_client/readme.html" title="to consume protected API">OAuth2 Client</a></li> <li><a href="../_015_oauth2_server/readme.html" title="offering protected API">OAuth2 Server</a></li> <li><a href="../_016_forms/readme.html" title="to capture user input">Forms</a></li> </ul> </nav> <nav id="right"> <h3><a href="../index.html">Examples by Tag</a></h3> <ul class="tags"> <li><tag title="Access-control Example(s)" data-content="&lt;a href=&quot;../_010_access_control/readme.html&quot;&gt;Access Control&lt;/a&gt; &lt;a href=&quot;../_014_oauth2_client/readme.html&quot;&gt;OAuth2 Client&lt;/a&gt; &lt;a href=&quot;../_015_oauth2_server/readme.html&quot;&gt;OAuth2 Server&lt;/a&gt;">access-control</tag><badge>3</badge></li> <li><tag title="Acl Example(s)" data-content="&lt;a href=&quot;../_010_access_control/readme.html&quot;&gt;Access Control&lt;/a&gt; &lt;a href=&quot;../_014_oauth2_client/readme.html&quot;&gt;OAuth2 Client&lt;/a&gt; &lt;a href=&quot;../_015_oauth2_server/readme.html&quot;&gt;OAuth2 Server&lt;/a&gt;">acl</tag><badge>3</badge></li> <li><tag title="Authentication Example(s)" data-content="&lt;a href=&quot;../_005_protected_api/readme.html&quot;&gt;Protected API&lt;/a&gt; &lt;a href=&quot;../_010_access_control/readme.html&quot;&gt;Access Control&lt;/a&gt; &lt;a href=&quot;../_014_oauth2_client/readme.html&quot;&gt;OAuth2 Client&lt;/a&gt; &lt;a href=&quot;../_015_oauth2_server/readme.html&quot;&gt;OAuth2 Server&lt;/a&gt;">authentication</tag><badge>4</badge></li> <li><tag title="Authorization Example(s)" data-content="&lt;a href=&quot;../_005_protected_api/readme.html&quot;&gt;Protected API&lt;/a&gt; &lt;a href=&quot;../_010_access_control/readme.html&quot;&gt;Access Control&lt;/a&gt; &lt;a href=&quot;../_014_oauth2_client/readme.html&quot;&gt;OAuth2 Client&lt;/a&gt; &lt;a href=&quot;../_015_oauth2_server/readme.html&quot;&gt;OAuth2 Server&lt;/a&gt;">authorization</tag><badge>4</badge></li> <li><tag title="Basic Example(s)" data-content="&lt;a href=&quot;../_001_helloworld/readme.html&quot;&gt;Hello World Example&lt;/a&gt; &lt;a href=&quot;../_002_minimal/readme.html&quot;&gt;Minimal Example&lt;/a&gt;">basic</tag><badge>2</badge></li> <li><tag title="Blade Example(s)" data-content="&lt;a href=&quot;../_016_forms/readme.html&quot;&gt;Forms Example&lt;/a&gt;">blade</tag></li> <li><tag title="Bootstrap Example(s)" data-content="&lt;a href=&quot;../_016_forms/readme.html&quot;&gt;Forms Example&lt;/a&gt;">bootstrap</tag></li> <li><tag title="Create Example(s)" data-content="&lt;a href=&quot;../_007_crud/readme.html&quot;&gt;CRUD&lt;/a&gt; &lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt; &lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">create</tag><badge>3</badge></li> <li><tag title="Custom Example(s)" data-content="&lt;a href=&quot;../_012_vendor_mime/readme.html&quot;&gt;Vendor MIME&lt;/a&gt;">custom</tag></li> <li><tag title="Debug Example(s)" data-content="&lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt;">debug</tag></li> <li><tag title="Delete Example(s)" data-content="&lt;a href=&quot;../_006_routing/readme.html&quot;&gt;Routing&lt;/a&gt; &lt;a href=&quot;../_007_crud/readme.html&quot;&gt;CRUD&lt;/a&gt; &lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt; &lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">delete</tag><badge>4</badge></li> <li><tag title="Doc Example(s)" data-content="&lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt;">doc</tag></li> <li><tag title="Emmet Example(s)" data-content="&lt;a href=&quot;../_016_forms/readme.html&quot;&gt;Forms Example&lt;/a&gt;">emmet</tag></li> <li><tag title="Exception Example(s)" data-content="&lt;a href=&quot;../_004_error_response/readme.html&quot;&gt;Error Response&lt;/a&gt;">exception</tag></li> <li><tag title="Filter Example(s)" data-content="&lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">filter</tag></li> <li><tag title="Form Example(s)" data-content="&lt;a href=&quot;../_016_forms/readme.html&quot;&gt;Forms Example&lt;/a&gt;">form</tag></li> <li><tag title="Foundation Example(s)" data-content="&lt;a href=&quot;../_016_forms/readme.html&quot;&gt;Forms Example&lt;/a&gt;">foundation</tag></li> <li><tag title="Get Example(s)" data-content="&lt;a href=&quot;../_006_routing/readme.html&quot;&gt;Routing&lt;/a&gt; &lt;a href=&quot;../_007_crud/readme.html&quot;&gt;CRUD&lt;/a&gt; &lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt; &lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">get</tag><badge>4</badge></li> <li><tag title="Handlebar Example(s)" data-content="&lt;a href=&quot;../_013_html/readme.html&quot;&gt;Html Format&lt;/a&gt;">handlebar</tag></li> <li><tag title="Html Example(s)" data-content="&lt;a href=&quot;../_013_html/readme.html&quot;&gt;Html Format&lt;/a&gt; &lt;a href=&quot;../_016_forms/readme.html&quot;&gt;Forms Example&lt;/a&gt;">html</tag><badge>2</badge></li> <li><tag title="Http Status Example(s)" data-content="&lt;a href=&quot;../_002_minimal/readme.html&quot;&gt;Minimal Example&lt;/a&gt; &lt;a href=&quot;../_004_error_response/readme.html&quot;&gt;Error Response&lt;/a&gt;">http status</tag><badge>2</badge></li> <li><tag title="Json Example(s)" data-content="&lt;a href=&quot;../_003_multiformat/readme.html&quot;&gt;Multi-format&lt;/a&gt;">json</tag></li> <li><tag title="Mediatype Example(s)" data-content="&lt;a href=&quot;../_012_vendor_mime/readme.html&quot;&gt;Vendor MIME&lt;/a&gt;">mediatype</tag></li> <li><tag title="Mime Example(s)" data-content="&lt;a href=&quot;../_012_vendor_mime/readme.html&quot;&gt;Vendor MIME&lt;/a&gt;">mime</tag></li> <li><tag title="Mustache Example(s)" data-content="&lt;a href=&quot;../_013_html/readme.html&quot;&gt;Html Format&lt;/a&gt;">mustache</tag></li> <li><tag title="Patch Example(s)" data-content="&lt;a href=&quot;../_006_routing/readme.html&quot;&gt;Routing&lt;/a&gt;">patch</tag></li> <li><tag title="Php Example(s)" data-content="&lt;a href=&quot;../_013_html/readme.html&quot;&gt;Html Format&lt;/a&gt;">php</tag></li> <li><tag title="Post Example(s)" data-content="&lt;a href=&quot;../_006_routing/readme.html&quot;&gt;Routing&lt;/a&gt; &lt;a href=&quot;../_007_crud/readme.html&quot;&gt;CRUD&lt;/a&gt; &lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt; &lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">post</tag><badge>4</badge></li> <li><tag title="Production Example(s)" data-content="&lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt;">production</tag></li> <li><tag title="Put Example(s)" data-content="&lt;a href=&quot;../_006_routing/readme.html&quot;&gt;Routing&lt;/a&gt; &lt;a href=&quot;../_007_crud/readme.html&quot;&gt;CRUD&lt;/a&gt; &lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt; &lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">put</tag><badge>4</badge></li> <li><tag title="Rate-limiting Example(s)" data-content="&lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">rate-limiting</tag></li> <li><tag title="Read Example(s)" data-content="&lt;a href=&quot;../_007_crud/readme.html&quot;&gt;CRUD&lt;/a&gt; &lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt; &lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">read</tag><badge>3</badge></li> <li><tag title="Retrieve Example(s)" data-content="&lt;a href=&quot;../_007_crud/readme.html&quot;&gt;CRUD&lt;/a&gt; &lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt; &lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">retrieve</tag><badge>3</badge></li> <li><tag title="Routing Example(s)" data-content="&lt;a href=&quot;../_006_routing/readme.html&quot;&gt;Routing&lt;/a&gt; &lt;a href=&quot;../_007_crud/readme.html&quot;&gt;CRUD&lt;/a&gt; &lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt;">routing</tag><badge>3</badge></li> <li><tag title="Secure Example(s)" data-content="&lt;a href=&quot;../_010_access_control/readme.html&quot;&gt;Access Control&lt;/a&gt; &lt;a href=&quot;../_014_oauth2_client/readme.html&quot;&gt;OAuth2 Client&lt;/a&gt; &lt;a href=&quot;../_015_oauth2_server/readme.html&quot;&gt;OAuth2 Server&lt;/a&gt;">secure</tag><badge>3</badge></li> <li><tag title="Template Example(s)" data-content="&lt;a href=&quot;../_013_html/readme.html&quot;&gt;Html Format&lt;/a&gt;">template</tag></li> <li><tag title="Throttle Example(s)" data-content="&lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">throttle</tag></li> <li><tag title="Twig Example(s)" data-content="&lt;a href=&quot;../_013_html/readme.html&quot;&gt;Html Format&lt;/a&gt;">twig</tag></li> <li><tag title="Update Example(s)" data-content="&lt;a href=&quot;../_007_crud/readme.html&quot;&gt;CRUD&lt;/a&gt; &lt;a href=&quot;../_008_documentation/readme.html&quot;&gt;Documentation&lt;/a&gt; &lt;a href=&quot;../_009_rate_limiting/readme.html&quot;&gt;Rate Limiting&lt;/a&gt;">update</tag><badge>3</badge></li> <li><tag title="Validation Example(s)" data-content="&lt;a href=&quot;../_002_minimal/readme.html&quot;&gt;Minimal Example&lt;/a&gt; &lt;a href=&quot;../_004_error_response/readme.html&quot;&gt;Error Response&lt;/a&gt; &lt;a href=&quot;../_016_forms/readme.html&quot;&gt;Forms Example&lt;/a&gt;">validation</tag><badge>3</badge></li> <li><tag title="Vendor Example(s)" data-content="&lt;a href=&quot;../_012_vendor_mime/readme.html&quot;&gt;Vendor MIME&lt;/a&gt;">vendor</tag></li> <li><tag title="Versioning Example(s)" data-content="&lt;a href=&quot;../_011_versioning/readme.html&quot;&gt;Versioning&lt;/a&gt; &lt;a href=&quot;../_012_vendor_mime/readme.html&quot;&gt;Vendor MIME&lt;/a&gt;">versioning</tag><badge>2</badge></li> <li><tag title="View Example(s)" data-content="&lt;a href=&quot;../_013_html/readme.html&quot;&gt;Html Format&lt;/a&gt;">view</tag></li> <li><tag title="Xml Example(s)" data-content="&lt;a href=&quot;../_003_multiformat/readme.html&quot;&gt;Multi-format&lt;/a&gt;">xml</tag></li> </ul> </nav> <article id="page"> <div class="right"><small>16</small></div> <p><a id="forms-example" class="anchor"></a><h2>Forms Example <requires>PHP >= 5.3</requires></h2></p> <p><tag>form</tag> <tag>validation</tag> <tag>blade</tag> <tag>html</tag> <tag>bootstrap</tag> <tag>foundation</tag> <tag>emmet</tag></p> <p>Forms is a utility class that builds web forms in one of the following in built styles</p> <ul> <li>Plain Html 5</li> <li>Twitter Bootstrap 3</li> <li>Zerb Foundation 5</li> </ul> <pre><code class="php">use Luracast/Restler/UI/Forms; use Luracast/Restler/UI/FormStyles; Forms::$style = FormStyles::$bootstrap3; // FormStyles::$foundation5; </code></pre> <p>Where ever you need the generated forms (typically in view templates) just call</p> <pre><code class="php">echo Forms::get('POST','user/signup'); </code></pre> <p>If you are using twig templates you can use the following instead</p> <pre><code>{{ form('POST', 'user/signup') }} </code></pre> <p><a id="emmet-templates" class="anchor"></a><h2>Emmet Templates</h2></p> <p>Forms is using Emmet templates, with which adding more styles is very easy</p> <p>Emmet Templates is built with a subset of Emmet as in <a href="http://emmet.io/" target="_blank">emmet.io</a> extended to serve as a template engine</p> <p>For example</p> <pre><code>.form-group&gt;label{$label#}+input.form-control[value=$value# type=$type# </code></pre> <p>Expands to the following html</p> <pre><code class="html">&lt;div class="form-group"&gt; &lt;label&gt;Email&lt;/label&gt; &lt;input class="form-control" value="arul@luracast.com" type="email"/&gt; &lt;/div&gt; </code></pre> <p>When the given data is</p> <pre><code class="php">array( 'label' =&gt; 'Email', 'value' =&gt; 'arul@luracast.com', 'type' =&gt; 'email' ); </code></pre> <p>Typically this data is supplied by the metadata extracted from the php-doc comments of of the api parameters</p> <p><abbr title="_016_forms/Users.php">Users.php</abbr> and <abbr title="_016_forms/Address.php">Address.php</abbr> shows the bare minimum code needed to get create forms.</p> <p>Check out the resulting form <a href="users.html" target="_blank">here</a>. <a href="users.html" target="_blank"><img src="../resources/Form.gif" alt="Forms" /></a> We have made it easy to try different styles Also this example serves as an example for our Blade template integration</p> <p>See <abbr title="_016_forms/views/base/bootstrap3.blade.php">bootstrap3.blade.php</abbr> and <abbr title="_016_forms/views/base/foundation5.blade.php">foundation5.blade.php</abbr></p> <blockquote> <p>This API Server is made using the following php files/folders</p> <ul> <li><abbr title="_016_forms/index.php">index.php</abbr> (gateway)</li> <li><abbr title="_016_forms/Users.php">Users.php</abbr> (api)</li> <li><abbr title="_016_forms/Address.php">Address.php</abbr> (helper)</li> <li><abbr title="../../vendor/restler.php">restler.php</abbr> (framework)</li> <li><abbr title="../../vendor/Luracast/Restler/Format/HtmlFormat.php">HtmlFormat.php</abbr> (format)</li> <li><abbr title="../../vendor/Luracast/Restler/Format/JsonFormat.php">JsonFormat.php</abbr> (format)</li> </ul> </blockquote> <p>This API Server exposes the following URIs</p> <pre><code>GET users ⇠ Users::index() POST users/signin ⇠ Users::postSignIn() POST users/signup ⇠ Users::postSignUp() </code></pre> </article> <footer> &#169; 2010 <a title="Luracast.com" href="http://luracast.com"><img src="../resources/Luracast_dark.png" width="180" height="32" title="Helping Developers with Tools, Utilities, Frameworks and Services"/></a> </footer> </body> </html>