1. 功能介绍

    页面中输入相关的限制校验(比如是否必填,最大输入数,数字输入限制,Email,身份证校验等)只需在网页中定义对应的校验属性,然后在页面提交中定义校验方法即可。

  2. 主要特性

    1. 提供完整的客户端校验解决方案,提供通用的统一入口简化校验,也提供灵活的扩展性。
    2. 查询操作和提交操作的校验方法分离,统一办业务时一页操作的效果。
    3. 开放更灵活的校验方法,方便定制。
  3. 校验配置

    1. 必填、最大输入、最小输入校验

      <input
      	type="text" jwcid="SCHE_SUBJECT@TextField" value="ognl:info.SCHE_SUBJECT"
      	desc="日程主题"
      	nullable="no" //是否必填,为no表示必填,默认为非必填
      	maxsize="100" //最大输入数
      	minsize="10"//最小输入数
      	equsize="10"//定值
      	datatype="text" //指定校验内容为文本
      />
      
    2. 数字校验

      <input
      	type="text" jwcid="SCHE_SUBJECT@TextField" value="ognl:info.SCHE_SUBJECT"
      	desc="日程主题"
      	datatype="numeric" //指定校验内容数字
      />
      

      说明:numeric(数字),integer(整数),pinteger(正整数),ninteger(负整数),nature(自然数)
    3. 日期时间校验

      <input
      	type="text" jwcid="SCHE_TIME@TextField" value="ognl:info.SCHE_TIME"
      	desc="提醒时间"
      	datatype="date" //指定校验内容日期时间
      	format="yyyy-MM-dd HH:mm" //校验输入的日期时间格式
      />
      

      说明:
      日期格式目前支持:
      yyyy,yyyyMM,yyyy-MM,yyyy/MM
      yyyyMMdd,yyyy-MM-dd,yyyy/MM/dd
      HH,HHmm,HH:mm,HHmmss,HH:mm:ss
      yyyyMMdd HH,yyyy-MM-dd HH,yyyy/MM/dd HH
      yyyyMMdd HHmm,yyyy-MM-dd HH:mm,yyyy/MM/dd HH:mm
      yyyyMMdd HHmmss,yyyy-MM-dd HH:mm:ss,yyyy/MM/dd HH:mm:ss
    4. Email地址校验

      <input
      	type="text"
      	jwcid="SCHE_TIME@TextField" value="ognl:info.SCHE_TIME"
      	desc="提醒时间"
      	datatype="email" //指定校验内容Email地址
      />
      
    5. 文件类型校验

      <input
      	type="file" datatype="file"
      	extname="png,jpg,jpeg"
      	desc="头像"
      />
      
    6. 手机号码校验

      datatype="mbphone"
      
    7. 身份证号码

      datatype="pspt"
      
    8. IP地址校验

      datatype="ip"
      
    9. 只能为数字或字母

      datatype="numchar"
      
    10. 只能为数字或大写字母

      datatype="numuchar"
      
    11. 只能为数字或小写字母

      datatype="numlchar"
      
  4. 校验分类

    1. 初始化(初始化)

      1. initialAll(object);

        参数1(object):点击时按钮的对象,如initialAll(this);
        说明:如果不用所提供的校验方法,在提交操作时需要嵌套封装该方法
    2. 校验操作(纯校验,嵌套调用,如果需要自定义JS方法,可以嵌套引用这些js方法)

      1. verifyField(field)

        参数1(field):校验的对象,如verifyField (getElement(‘STAFF_ID’);
        说明:校验指定对象
      2. verifyAll(object)

        参数1(object):校验的对象或者指定区域,如verifyAll (this)或者verifyAll (‘qryarea’);
        说明:校验指定对象区域,verifyAll (this)表示校验点击对象的form区域
      3. verifyBox(object , boxName, info)

        参数1(object): 提交按钮的对象,如verifyBox (this, ‘xxxbox’)
        参数2(boxName):校验的checkbox的名称,如verifyBox (‘chkname’)
        参数3(info):可选参数,校验的checkbox的提示信息,如verifyBox (‘chkname’, ‘请选择XX数据’)
        说明:校验checkbox是否选中
    3. 提交操作(直接调用的提交操作)

      1. confirmOper(object)

        参数1(object):提交按钮的对象,如confirmOper(this);
        说明:不校验,不确认提示,仅做提交用,适用其他功能包装使用
      2. confirmAll(object)

        参数1(object): 校验的对象或者指定区域,如confirmAll (this)或者confirmAll (‘qryarea’);
        说明:校验,不确认提示,适用校验后不确认提示的情况
      3. confirmInfo(object, info)

        参数1(object): 提交按钮的对象,如confirmInfo (this)
        参数2(info):可选参数,提交时的确认提示信息,如confirmInfo (this, ‘确认吗’)
        说明:不校验,确认提示,适用不校验但需确认提示的情况
      4. confirmForm(object, info)

        参数1(object): 校验的对象或者指定区域,如confirmForm (this)或者confirmForm (‘qryarea’);
        参数2(info):可选参数,提交时的确认提示信息,如confirmForm (this, ‘确认吗’)
        说明:校验,确认提示,适用既校验又需确认提示的情况
      5. confirmBox(object, boxName, info)

        参数1(object): 提交按钮的对象,如confirmBox (this, ‘xxxbox’)
        参数2(boxName):校验的checkbox的名称,如confirmBox (this, ‘xxxbox’)
        参数3(info):可选参数,校验的checkbox的提示信息,如confirmBox (this, ‘chkname’, ‘请选择XX数据’)
        说明:校验checkbox是否选中,并提供确认提示,适用于校验提交checkbox勾选提交操作
    4. 查询操作(直接调用的查询操作)

      1. queryOper(object)

        参数1(object):查询按钮的对象,如queryOper(this);
        说明:不校验,不确认提示,仅做查询用,适用其他功能包装使用
      2. queryAll(object)

        参数1(object): 校验的对象或者指定区域,如queryAll (this)或者queryAll (‘qryarea’);
        说明:校验,不确认提示,适用校验后不确认提示的情况
      3. queryInfo(object, info)

        参数1(object): 查询按钮的对象,如queryInfo (this)
        参数2(info):可选参数,查询时的确认提示信息,如queryInfo (this, ‘确认吗’)
        说明:不校验,确认提示,适用不校验但需确认提示的情况
      4. queryForm(object, info)

        参数1(object): 校验的对象或者指定区域,如queryForm (this)或者queryForm (‘qryarea’);
        参数2(info):可选参数,提交时的确认提示信息,如queryForm (this, ‘确认吗’)
        说明:校验,确认提示,适用既校验又需确认提示的情况
      5. queryBox(object, boxName, info)

        参数1(object): 查询按钮的对象,如queryBox (this, ‘xxxbox’)
        参数2(boxName):校验的checkbox的名称,如queryBox (this, ‘xxxbox’)
        参数3(info):可选参数,校验的checkbox的提示信息,如queryBox (this, ‘chkname’, ‘请选择XX数据’)
        说明:校验checkbox是否选中,并提供确认提示,适用于校验提交checkbox勾选提交操作
  5. 注意事项

    1. 配置校验属性,必须带有desc="..."参数,不配置将不会对当前的表单控件校验
    2. verifyAll只做校验,没有载入效果,所以verifyAll是使用场景为自定义校验时可以组合使用
    3. 直接校验可以使用confrimXXX(提交类),queryXXX(查询类)操作,如果需要自定义校验,可以嵌套使用verifyXXX(校验类),若不需要任何校验,但也必须加上initialAll(初始化),保证参数传递的一致
    4. 注意区分confirmXX(提交操作)和queryXXX(查询操作,在页面需要返回数据,如查询列表,查询详情)方法,此两类方法的函数方法都有一一对应的
    5. 如果需要定制校验函数,最好采用verifyXXX+confirmXXX|queryXXX来组合实现
    6. 对于不采用目前所提供的校验方法的应用程序,必须封装初始方法
    7. 常用开发只需使用confirmXX或queryXX类方法
  6. 代码片段

    1. 配置校验属性,统一校验

      <input
      	type="text" jwcid="SCHE_SUBJECT@TextField" value="ognl:info.SCHE_SUBJECT" desc="日程主题"
      	nullable="no" //是否必填,为no表示必填,默认为非必填
      	maxsize="100" //最大输入数
      	datatype="text" //校验类型
      />
      <input
      	type="text" jwcid="SCHE_SUBJECT@TextField" value="ognl:info.SCHE_SUBJECT" desc="日程主题"
      	datatype="numeric" //指定校验内容数字
      />
      <input
      	type="button" jwcid="bcreate@Submit" value="新 增" listener="ognl:listeners.createSchedule"
      	desc="日程信息" //确认提交时提示的信息
      	onclick="return confirmForm(this);" //执行校验方法
      />
      //通用的校验不需要写任何代码,因为校验配置已经能够满足需求
      
    2. 自定义配置校验

      <script language="JavaScript" type="text/JavaScript">
      	function validateTest(obj) {
      		if (!verifyAll(obj)) return false; //先校验已配置的校验属性
      		//自定义校验内容
      		if (utype == 1) {
      			alert("非法输入");
      			return false;
      		}
      		return confirmOper(obj); //不校验,不确认提示,仅做提交用,适用包装使用
      	}
      </script>
      <input
      	type="text" jwcid="SCHE_SUBJECT@TextField" value="ognl:info.SCHE_SUBJECT" desc="日程主题"
      	nullable="no" //是否必填,为no表示必填,默认为非必填
      	maxsize="100" //最大输入数
      	datatype="text" //校验类型
      />
      <input
      	type="text" jwcid="SCHE_SUBJECT@TextField" value="ognl:info.SCHE_SUBJECT" desc="日程主题"
      	datatype="numeric" //指定校验内容数字
      />
      <input
      	type="button" jwcid="bcreate@Submit" value="新 增" listener="ognl:listeners.createSchedule"
      	desc="日程信息" //确认提交时提示的信息
      	onclick="return validateTest(this);" //执行自定义校验方法
      />
      //自定义校验的原则是,可以用verifyXXX方法先做一些目前支持的校验,之后对程序相关的业务性校验,最后用同一的queryOper或者confirmOper做提交操作,这样能够锁定操作保证不会重复操作