parsleyjs

<!DOCTYPE html> <html> <head> <title>main.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <ul id="jump_to"> <li> <a class="large" href="javascript:void(0);">Jump To …</a> <a class="small" href="javascript:void(0);">+</a> <div id="jump_wrapper"> <div id="jump_page"><a class="source" href="../index.html"><<< back to documentation</a> <a class="source" href="abstract.html"> abstract.js </a> <a class="source" href="defaults.html"> defaults.js </a> <a class="source" href="factory.html"> factory.js </a> <a class="source" href="field.html"> field.js </a> <a class="source" href="form.html"> form.js </a> <a class="source" href="main.html"> main.js </a> <a class="source" href="multiple.html"> multiple.js </a> <a class="source" href="pubsub.html"> pubsub.js </a> <a class="source" href="remote.html"> remote.js </a> <a class="source" href="ui.html"> ui.js </a> <a class="source" href="utils.html"> utils.js </a> <a class="source" href="validator.html"> validator.js </a> <a class="source" href="validator_registry.html"> validator_registry.js </a> </div> </li> </ul> <ul class="sections"> <li id="title"> <div class="annotation"> <h1>main.js</h1> </div> </li> <li id="section-1"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-1">¶</a> </div> </div> <div class="content"><div class='highlight'><pre><span class="hljs-keyword">import</span> $ <span class="hljs-keyword">from</span> <span class="hljs-string">'jquery'</span>; <span class="hljs-keyword">import</span> ParsleyUtils <span class="hljs-keyword">from</span> <span class="hljs-string">'./utils'</span>; <span class="hljs-keyword">import</span> ParsleyDefaults <span class="hljs-keyword">from</span> <span class="hljs-string">'./defaults'</span>; <span class="hljs-keyword">import</span> ParsleyAbstract <span class="hljs-keyword">from</span> <span class="hljs-string">'./abstract'</span>; <span class="hljs-keyword">import</span> ParsleyValidatorRegistry <span class="hljs-keyword">from</span> <span class="hljs-string">'./validator_registry'</span>; <span class="hljs-keyword">import</span> ParsleyUI <span class="hljs-keyword">from</span> <span class="hljs-string">'./ui'</span>; <span class="hljs-keyword">import</span> ParsleyForm <span class="hljs-keyword">from</span> <span class="hljs-string">'./form'</span>; <span class="hljs-keyword">import</span> ParsleyField <span class="hljs-keyword">from</span> <span class="hljs-string">'./field'</span>; <span class="hljs-keyword">import</span> ParsleyMultiple <span class="hljs-keyword">from</span> <span class="hljs-string">'./multiple'</span>; <span class="hljs-keyword">import</span> ParsleyFactory <span class="hljs-keyword">from</span> <span class="hljs-string">'./factory'</span>; <span class="hljs-keyword">var</span> vernums = $.fn.jquery.split(<span class="hljs-string">'.'</span>); <span class="hljs-keyword">if</span> (<span class="hljs-built_in">parseInt</span>(vernums[<span class="hljs-number">0</span>]) <= <span class="hljs-number">1</span> && <span class="hljs-built_in">parseInt</span>(vernums[<span class="hljs-number">1</span>]) < <span class="hljs-number">8</span>) { <span class="hljs-keyword">throw</span> <span class="hljs-string">"The loaded version of jQuery is too old. Please upgrade to 1.8.x or better."</span>; } <span class="hljs-keyword">if</span> (!vernums.forEach) { ParsleyUtils.warn(<span class="hljs-string">'Parsley requires ES5 to run properly. Please include https://github.com/es-shims/es5-shim'</span>); }</pre></div></div> </li> <li id="section-2"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-2">¶</a> </div> <p>Inherit <code>on</code>, <code>off</code> & <code>trigger</code> to Parsley:</p> </div> <div class="content"><div class='highlight'><pre><span class="hljs-keyword">var</span> Parsley = $.extend(<span class="hljs-keyword">new</span> ParsleyAbstract(), { <span class="hljs-attr">$element</span>: $(<span class="hljs-built_in">document</span>), <span class="hljs-attr">actualizeOptions</span>: <span class="hljs-literal">null</span>, <span class="hljs-attr">_resetOptions</span>: <span class="hljs-literal">null</span>, <span class="hljs-attr">Factory</span>: ParsleyFactory, <span class="hljs-attr">version</span>: <span class="hljs-string">'@@version'</span> });</pre></div></div> </li> <li id="section-3"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-3">¶</a> </div> <p>Supplement ParsleyField and Form with ParsleyAbstract This way, the constructors will have access to those methods</p> </div> <div class="content"><div class='highlight'><pre>$.extend(ParsleyField.prototype, ParsleyUI.Field, ParsleyAbstract.prototype); $.extend(ParsleyForm.prototype, ParsleyUI.Form, ParsleyAbstract.prototype);</pre></div></div> </li> <li id="section-4"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-4">¶</a> </div> <p>Inherit actualizeOptions and _resetOptions:</p> </div> <div class="content"><div class='highlight'><pre>$.extend(ParsleyFactory.prototype, ParsleyAbstract.prototype);</pre></div></div> </li> <li id="section-5"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-5">¶</a> </div> <h3 id="jquery-api">jQuery API</h3> <p><code>$('.elem').parsley(options)</code> or <code>$('.elem').psly(options)</code></p> </div> <div class="content"><div class='highlight'><pre>$.fn.parsley = $.fn.psly = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">options</span>) </span>{ <span class="hljs-keyword">if</span> (<span class="hljs-keyword">this</span>.length > <span class="hljs-number">1</span>) { <span class="hljs-keyword">var</span> instances = []; <span class="hljs-keyword">this</span>.each(<span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{ instances.push($(<span class="hljs-keyword">this</span>).parsley(options)); }); <span class="hljs-keyword">return</span> instances; }</pre></div></div> </li> <li id="section-6"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-6">¶</a> </div> <p>Return undefined if applied to non existing DOM element</p> </div> <div class="content"><div class='highlight'><pre> <span class="hljs-keyword">if</span> (!$(<span class="hljs-keyword">this</span>).length) { ParsleyUtils.warn(<span class="hljs-string">'You must bind Parsley on an existing element.'</span>); <span class="hljs-keyword">return</span>; } <span class="hljs-keyword">return</span> <span class="hljs-keyword">new</span> ParsleyFactory(<span class="hljs-keyword">this</span>, options); };</pre></div></div> </li> <li id="section-7"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-7">¶</a> </div> <h3 id="parsleyfield-and-parsleyform-extension">ParsleyField and ParsleyForm extension</h3> <p>Ensure the extension is now defined if it wasn’t previously</p> </div> <div class="content"><div class='highlight'><pre><span class="hljs-keyword">if</span> (<span class="hljs-string">'undefined'</span> === <span class="hljs-keyword">typeof</span> <span class="hljs-built_in">window</span>.ParsleyExtend) <span class="hljs-built_in">window</span>.ParsleyExtend = {};</pre></div></div> </li> <li id="section-8"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-8">¶</a> </div> <h3 id="parsley-config">Parsley config</h3> <p>Inherit from ParsleyDefault, and copy over any existing values</p> </div> <div class="content"><div class='highlight'><pre>Parsley.options = $.extend(ParsleyUtils.objectCreate(ParsleyDefaults), <span class="hljs-built_in">window</span>.ParsleyConfig); <span class="hljs-built_in">window</span>.ParsleyConfig = Parsley.options; <span class="hljs-comment">// Old way of accessing global options</span></pre></div></div> </li> <li id="section-9"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-9">¶</a> </div> <h3 id="globals">Globals</h3> </div> <div class="content"><div class='highlight'><pre><span class="hljs-built_in">window</span>.Parsley = <span class="hljs-built_in">window</span>.psly = Parsley; <span class="hljs-built_in">window</span>.ParsleyUtils = ParsleyUtils;</pre></div></div> </li> <li id="section-10"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-10">¶</a> </div> <h3 id="define-methods-that-forward-to-the-registry-and-deprecate-all-access-except-through-window-parsley">Define methods that forward to the registry, and deprecate all access except through window.Parsley</h3> </div> <div class="content"><div class='highlight'><pre><span class="hljs-keyword">var</span> registry = <span class="hljs-built_in">window</span>.Parsley._validatorRegistry = <span class="hljs-keyword">new</span> ParsleyValidatorRegistry(<span class="hljs-built_in">window</span>.ParsleyConfig.validators, <span class="hljs-built_in">window</span>.ParsleyConfig.i18n); <span class="hljs-built_in">window</span>.ParsleyValidator = {}; $.each(<span class="hljs-string">'setLocale addCatalog addMessage addMessages getErrorMessage formatMessage addValidator updateValidator removeValidator'</span>.split(<span class="hljs-string">' '</span>), <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">i, method</span>) </span>{ <span class="hljs-built_in">window</span>.Parsley[method] = $.proxy(registry, method); <span class="hljs-built_in">window</span>.ParsleyValidator[method] = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{ ParsleyUtils.warnOnce(<span class="hljs-string">`Accessing the method '<span class="hljs-subst">${method}</span>' through ParsleyValidator is deprecated. Simply call 'window.Parsley.<span class="hljs-subst">${method}</span>(...)'`</span>); <span class="hljs-keyword">return</span> <span class="hljs-built_in">window</span>.Parsley[method](...arguments); }; });</pre></div></div> </li> <li id="section-11"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-11">¶</a> </div> <h3 id="parsleyui">ParsleyUI</h3> <p>Deprecated global object</p> </div> <div class="content"><div class='highlight'><pre><span class="hljs-built_in">window</span>.Parsley.UI = ParsleyUI; <span class="hljs-built_in">window</span>.ParsleyUI = { <span class="hljs-attr">removeError</span>: <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">instance, name, doNotUpdateClass</span>) </span>{ <span class="hljs-keyword">var</span> updateClass = <span class="hljs-literal">true</span> !== doNotUpdateClass; ParsleyUtils.warnOnce(<span class="hljs-string">`Accessing ParsleyUI is deprecated. Call 'removeError' on the instance directly. Please comment in issue 1073 as to your need to call this method.`</span>); <span class="hljs-keyword">return</span> instance.removeError(name, {updateClass}); }, <span class="hljs-attr">getErrorsMessages</span>: <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">instance</span>) </span>{ ParsleyUtils.warnOnce(<span class="hljs-string">`Accessing ParsleyUI is deprecated. Call 'getErrorsMessages' on the instance directly.`</span>); <span class="hljs-keyword">return</span> instance.getErrorsMessages(); } }; $.each(<span class="hljs-string">'addError updateError'</span>.split(<span class="hljs-string">' '</span>), <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">i, method</span>) </span>{ <span class="hljs-built_in">window</span>.ParsleyUI[method] = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">instance, name, message, assert, doNotUpdateClass</span>) </span>{ <span class="hljs-keyword">var</span> updateClass = <span class="hljs-literal">true</span> !== doNotUpdateClass; ParsleyUtils.warnOnce(<span class="hljs-string">`Accessing ParsleyUI is deprecated. Call '<span class="hljs-subst">${method}</span>' on the instance directly. Please comment in issue 1073 as to your need to call this method.`</span>); <span class="hljs-keyword">return</span> instance[method](name, {message, assert, updateClass}); }; });</pre></div></div> </li> <li id="section-12"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-12">¶</a> </div> <h3 id="parsley-auto-binding">PARSLEY auto-binding</h3> <p>Prevent it by setting <code>ParsleyConfig.autoBind</code> to <code>false</code></p> </div> <div class="content"><div class='highlight'><pre><span class="hljs-keyword">if</span> (<span class="hljs-literal">false</span> !== <span class="hljs-built_in">window</span>.ParsleyConfig.autoBind) { $(<span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{</pre></div></div> </li> <li id="section-13"> <div class="annotation"> <div class="pilwrap "> <a class="pilcrow" href="#section-13">¶</a> </div> <p>Works only on <code>data-parsley-validate</code>.</p> </div> <div class="content"><div class='highlight'><pre> <span class="hljs-keyword">if</span> ($(<span class="hljs-string">'[data-parsley-validate]'</span>).length) $(<span class="hljs-string">'[data-parsley-validate]'</span>).parsley(); }); } <span class="hljs-keyword">export</span> <span class="hljs-keyword">default</span> Parsley;</pre></div></div> </li> </ul> </div> <script type="text/javascript">var _gaq=_gaq||[];_gaq.push(["_setAccount","UA-37229467-1"]);_gaq.push(["_trackPageview"]);(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src=("https:"==document.location.protocol?"https://ssl":"http://www")+".google-analytics.com/ga.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})();</script></body> </html>