docs/source/VTypes.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   5   <title>The source code</title>
   6   <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   7   <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   8   <style type="text/css">
   9     .highlight { display: block; background-color: #ddd; }
  10   </style>
  11   <script type="text/javascript">
  12     function highlight() {
  13       document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
  14     }
  15   </script>
  16 </head>
  17 <body onload="prettyPrint(); highlight();">
  18   <pre class="prettyprint lang-js"><span id='Ext-form-field-VTypes'>/**
  19 </span> * @singleton
  20  * @alternateClassName Ext.form.VTypes
  21  *
  22  * This is a singleton object which contains a set of commonly used field validation functions
  23  * and provides a mechanism for creating reusable custom field validations.
  24  * The following field validation functions are provided out of the box:
  25  *
  26  * - {@link #alpha}
  27  * - {@link #alphanum}
  28  * - {@link #email}
  29  * - {@link #url}
  30  *
  31  * VTypes can be applied to a {@link Ext.form.field.Text Text Field} using the `{@link Ext.form.field.Text#vtype vtype}` configuration:
  32  *
  33  *     Ext.create('Ext.form.field.Text', {
  34  *         fieldLabel: 'Email Address',
  35  *         name: 'email',
  36  *         vtype: 'email' // applies email validation rules to this field
  37  *     });
  38  *
  39  * To create custom VTypes:
  40  *
  41  *     // custom Vtype for vtype:'time'
  42  *     var timeTest = /^([1-9]|1[0-9]):([0-5][0-9])(\s[a|p]m)$/i;
  43  *     Ext.apply(Ext.form.field.VTypes, {
  44  *         //  vtype validation function
  45  *         time: function(val, field) {
  46  *             return timeTest.test(val);
  47  *         },
  48  *         // vtype Text property: The error text to display when the validation function returns false
  49  *         timeText: 'Not a valid time.  Must be in the format &quot;12:34 PM&quot;.',
  50  *         // vtype Mask property: The keystroke filter mask
  51  *         timeMask: /[\d\s:amp]/i
  52  *     });
  53  *
  54  * In the above example the `time` function is the validator that will run when field validation occurs,
  55  * `timeText` is the error message, and `timeMask` limits what characters can be typed into the field.
  56  * Note that the `Text` and `Mask` functions must begin with the same name as the validator function.
  57  *
  58  * Using a custom validator is the same as using one of the build-in validators - just use the name of the validator function
  59  * as the `{@link Ext.form.field.Text#vtype vtype}` configuration on a {@link Ext.form.field.Text Text Field}:
  60  *
  61  *     Ext.create('Ext.form.field.Text', {
  62  *         fieldLabel: 'Departure Time',
  63  *         name: 'departureTime',
  64  *         vtype: 'time' // applies custom time validation rules to this field
  65  *     });
  66  *
  67  * Another example of a custom validator:
  68  *
  69  *     // custom Vtype for vtype:'IPAddress'
  70  *     Ext.apply(Ext.form.field.VTypes, {
  71  *         IPAddress:  function(v) {
  72  *             return /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(v);
  73  *         },
  74  *         IPAddressText: 'Must be a numeric IP address',
  75  *         IPAddressMask: /[\d\.]/i
  76  *     });
  77  *
  78  * It's important to note that using {@link Ext#apply Ext.apply()} means that the custom validator function
  79  * as well as `Text` and `Mask` fields are added as properties of the `Ext.form.field.VTypes` singleton.
  80  */
  81 Ext.define('Ext.form.field.VTypes', (function(){
  82     // closure these in so they are only created once.
  83     var alpha = /^[a-zA-Z_]+$/,
  84         alphanum = /^[a-zA-Z0-9_]+$/,
  85         email = /^(\w+)([\-+.][\w]+)*@(\w[\-\w]*\.){1,5}([A-Za-z]){2,6}$/,
  86         url = /(((^https?)|(^ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&amp;#;`~=%!]*)(\.\w{2,})?)*\/?)/i;
  87
  88     // All these messages and functions are configurable
  89     return {
  90         singleton: true,
  91         alternateClassName: 'Ext.form.VTypes',
  92
  93 <span id='Ext-form-field-VTypes-method-email'>        /**
  94 </span>         * The function used to validate email addresses. Note that this is a very basic validation - complete
  95          * validation per the email RFC specifications is very complex and beyond the scope of this class, although this
  96          * function can be overridden if a more comprehensive validation scheme is desired. See the validation section
  97          * of the [Wikipedia article on email addresses][1] for additional information. This implementation is intended
  98          * to validate the following emails:
  99          *
 100          * - `barney@example.de`
 101          * - `barney.rubble@example.com`
 102          * - `barney-rubble@example.coop`
 103          * - `barney+rubble@example.com`
 104          *
 105          * [1]: http://en.wikipedia.org/wiki/E-mail_address
 106          *
 107          * @param {String} value The email address
 108          * @return {Boolean} true if the RegExp test passed, and false if not.
 109          */
 110         'email' : function(v){
 111             return email.test(v);
 112         },
 113 <span id='Ext-form-field-VTypes-property-emailText'>        /**
 114 </span>         * @property {String} emailText
 115          * The error text to display when the email validation function returns false.
 116          * Defaults to: 'This field should be an e-mail address in the format &quot;user@example.com&quot;'
 117          */
 118         'emailText' : 'This field should be an e-mail address in the format &quot;user@example.com&quot;',
 119 <span id='Ext-form-field-VTypes-property-emailMask'>        /**
 120 </span>         * @property {RegExp} emailMask
 121          * The keystroke filter mask to be applied on email input. See the {@link #email} method for information about
 122          * more complex email validation. Defaults to: /[a-z0-9_\.\-@]/i
 123          */
 124         'emailMask' : /[a-z0-9_\.\-@\+]/i,
 125
 126 <span id='Ext-form-field-VTypes-method-url'>        /**
 127 </span>         * The function used to validate URLs
 128          * @param {String} value The URL
 129          * @return {Boolean} true if the RegExp test passed, and false if not.
 130          */
 131         'url' : function(v){
 132             return url.test(v);
 133         },
 134 <span id='Ext-form-field-VTypes-property-urlText'>        /**
 135 </span>         * @property {String} urlText
 136          * The error text to display when the url validation function returns false.
 137          * Defaults to: 'This field should be a URL in the format &quot;http:/'+'/www.example.com&quot;'
 138          */
 139         'urlText' : 'This field should be a URL in the format &quot;http:/'+'/www.example.com&quot;',
 140
 141 <span id='Ext-form-field-VTypes-method-alpha'>        /**
 142 </span>         * The function used to validate alpha values
 143          * @param {String} value The value
 144          * @return {Boolean} true if the RegExp test passed, and false if not.
 145          */
 146         'alpha' : function(v){
 147             return alpha.test(v);
 148         },
 149 <span id='Ext-form-field-VTypes-property-alphaText'>        /**
 150 </span>         * @property {String} alphaText
 151          * The error text to display when the alpha validation function returns false.
 152          * Defaults to: 'This field should only contain letters and _'
 153          */
 154         'alphaText' : 'This field should only contain letters and _',
 155 <span id='Ext-form-field-VTypes-property-alphaMask'>        /**
 156 </span>         * @property {RegExp} alphaMask
 157          * The keystroke filter mask to be applied on alpha input. Defaults to: /[a-z_]/i
 158          */
 159         'alphaMask' : /[a-z_]/i,
 160
 161 <span id='Ext-form-field-VTypes-method-alphanum'>        /**
 162 </span>         * The function used to validate alphanumeric values
 163          * @param {String} value The value
 164          * @return {Boolean} true if the RegExp test passed, and false if not.
 165          */
 166         'alphanum' : function(v){
 167             return alphanum.test(v);
 168         },
 169 <span id='Ext-form-field-VTypes-property-alphanumText'>        /**
 170 </span>         * @property {String} alphanumText
 171          * The error text to display when the alphanumeric validation function returns false.
 172          * Defaults to: 'This field should only contain letters, numbers and _'
 173          */
 174         'alphanumText' : 'This field should only contain letters, numbers and _',
 175 <span id='Ext-form-field-VTypes-property-alphanumMask'>        /**
 176 </span>         * @property {RegExp} alphanumMask
 177          * The keystroke filter mask to be applied on alphanumeric input. Defaults to: /[a-z0-9_]/i
 178          */
 179         'alphanumMask' : /[a-z0-9_]/i
 180     };
 181 })());
 182 </pre>
 183 </body>
 184 </html>