我的框架:表单验证

た入场券 2022-09-19 10:52 171阅读 0赞

* 前端表单验证的用法
 
  
 
 luxury.validate(\{
 
 form:'<表单的Name>',          //注意:不可以再有名字为Name的表单项了,
 
 <表单项的Name>:\{ 
 
 //表单域的验证配置
 
 \},
 
 …...
 
 \})
 
  
 
  
 
 表单域参数
 
 <table style="direction:ltr;
 border-collapse:collapse;border-style:solid;border-color:#A3A3A3;border-width:
 1pt"> 
 <tbody> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> at </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;判断时机:keyup/blur&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 默认为blur </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> successMsg </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;验证成功后的提示&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> msgArea </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;用于显示错误信息的块&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选,默认会在表单域后自动生成一个Label(红色) </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> type </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> 'text/radio' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选,默认是Text(这可以处理text及textarea) </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> blank </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;此文本域不允许为空的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> empty </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;此文本域的默认值&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; (这东西其实是个default) </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> reg </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> &lt;正则验证表达式&gt; </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> regMsg </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;不满足正则验证表达式时的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 如reg则必须 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> min </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> &lt;最小值&gt; </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> minMsg </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;小于最小值时的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 如min则必须 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> max </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> &lt;最大值&gt; </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> maxMsg </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;大于最大值时的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 如max则必须 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> minLength </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> &lt;最小长度&gt; </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> minLengthMsg </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;短于最小长度的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 如minLength则必须 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> maxLength </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> &lt;最大长度&gt; </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> maxLengthMsg </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;长于最大长度的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 如maxLength则必须 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> validator </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> function(v){ &nbsp;&nbsp;&nbsp; //判断值是否有效的JS代码 &nbsp;&nbsp;&nbsp; //返回True表示有效 &nbsp;&nbsp;&nbsp; //返回字符串将作为提示出现 } </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> equal </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;对比域的ID&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> equalMsg </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;如果与对比域的值不同时的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 如equal则必须 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> ajax </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> { &nbsp;&nbsp;&nbsp; c:'&lt;控制器名称&gt;', &nbsp;&nbsp;&nbsp; a:'&lt;方法名称&gt;', &nbsp;&nbsp;&nbsp; p:&lt;其它参数对象&gt; } </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 额外会以v参数传递表单域的值,使用ajaxOk/ajaxError返回判断结果 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> mustInt </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;当文本域的值不是整数时的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> mustFloat </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;当文本域的值不是浮点数时的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:1.0708in;padding:4pt 4pt 4pt 4pt"> mustCurrency </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.8027in;padding:4pt 4pt 4pt 4pt"> '&lt;当文本域的值不是货币时的提示信息&gt;' 注:最多允许两位小数 </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:4.2166in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 </tbody> 
 </table>
 
  
 
  
 
 如果指定了type=='radio',则只能使用以下属性
 
 <table style="direction:ltr;
 border-collapse:collapse;border-style:solid;border-color:#A3A3A3;border-width:
 1pt"> 
 <tbody> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:.9069in;padding:4pt 4pt 4pt 4pt"> blank </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.5013in;padding:4pt 4pt 4pt 4pt"> '&lt;如果所有单选都未选择的提示信息&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:.7062in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:.9069in;padding:4pt 4pt 4pt 4pt"> msgArea </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.5013in;padding:4pt 4pt 4pt 4pt"> '&lt;用于显示错误信息的块&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:.7062in;padding:4pt 4pt 4pt 4pt"> 必须 </td> 
 </tr> 
 <tr> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:.9069in;padding:4pt 4pt 4pt 4pt"> successMsg </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:2.5013in;padding:4pt 4pt 4pt 4pt"> '&lt;验证成功后的提示&gt;' </td> 
 <td style="border-style:solid;border-color:#A3A3A3;border-width:1pt;
 vertical-align:top;width:.7062in;padding:4pt 4pt 4pt 4pt"> 可选 </td> 
 </tr> 
 </tbody> 
 </table>

阅读(238) | 评论(0) | 转发(0) |

上一篇：我的框架:模型

下一篇：我的框架:文件结构