zoukankan      html  css  js  c++  java
  • JFinal极速开发实战-业务功能开发-通用表单验证器

    提交表单数据时,需要经过前端的验证才能提交到后台,而后台的验证器再做一道数据的校验,成功之后才能进入action进行业务数据的处理。

    在表单数据的验证中,数据类型的验证还是比较固定的。首先是对录入数据的长度验证(最大->自带,最小->vMin),其次就是对数据的内容(类型->vType)进行有效性验证

    在日积月累的学习开发中,自己应该积累一些常见的数据校验处理方法,在不同的项目中只需要结合不同的UI修改一下验证提示即可。

    form_elements.html中的表单输入验证提示效果,根据不同的验证结果显示不同的颜色提示,JFinalUIB中只用上了验证成功绿色提示,验证失败红色提示,没有使用警告黄色提示。处理提示颜色的切换时使用的样式属性是has-success,has-error,所以再项目中只需要根据验证的结果,修改form_group后面的样式属性即可

    verify.js中的inputDataVali是通用的验证方法,参数的input对象,根据input对象,取输入类型数据校验的类型类型符合就取出最大和最小长度,进行数据长度的验证,根据验证结果调用hiddenInputColor和showInputColor修改输入框的颜色进行提示。接着根据数据验证类型调用对应的验证方法,验证数据是否符合要求,并且根据验证结果修改颜色提示,最后根据验证结果返回成功或者失败的布尔值。

    input输入框中的onblur事件是控制在焦点离开时立即进行数据的校验,这是初步的校验,在表单提交时会对所有的input输入框做一次性的校验,只有所有输入项都验证成功时才提交数据。

    form整体验证,在用户点击提交按钮时进行form的所有数据一次性校验,分下面两种方法。

    一是明确form中都是简单的数据类型校验,通用的验证能满足要求,可以调用formValiSubmint验证完成通过并提交请求;

    二是form中包含以下特殊的数据校验,比如账号的唯一性等等,需要单独写验证方法处理,这样就需要调用formVali验证通用的部分,再结合个性化验证,如果都验证通过时才提交表单。

    用户信息校验:用户信息编辑时有很多的输入项需要验证,包含了很多常见的数据类型验证,复杂的有弹出框选择性的验证,其实只要封装的简洁,应用起来都很容易,只是在input上面加几个扩展属性即可。

  • 相关阅读:
    octotree神器 For Github and GitLab 火狐插件
    实用篇如何使用github(本地、远程)满足基本需求
    PPA(Personal Package Archives)简介、兴起、使用
    Sourse Insight使用过程中的常使用功能简介
    Sourse Insight使用教程及常见的问题解决办法
    github 遇到Permanently added the RSA host key for IP address '192.30.252.128' to the list of known hosts问题解决
    二叉查找树的C语言实现(一)
    初识内核链表
    container_of 和 offsetof 宏详解
    用双向链表实现一个栈
  • 原文地址:https://www.cnblogs.com/tongx123/p/5442369.html
Copyright © 2011-2022 走看看