BootStrapValidator与My97日期校验的实例代码

概述首先my97的API中有自定义事件中有onpicking和onpicked事件、onclearing和oncleared事件、年月日时分秒的changing和changed。

首先my97的API中有自定义事件中有 onpicking 和 onpicked 事件 、onclearing 和 oncleared 事件、年月日时分秒的 changing和changed。

   我的HTML页面中需要展示的日期样子是:

<label  for="ConstructionPlanAdd_planStartTime">开始时间:</label>           <div >             <input  ID="ConstructionPlanAdd_planStartTime" name="planStartTime" type="text" placeholder="请选择开始时间" onFocus="WdatePicker({maxDate:'#F{$dp.$D(\'ConstructionPlanAdd_planEndTime\');}',dateFmt:'yyyy-MM-dd',Readonly:true})"/>           </div>           <label  for="ConstructionPlanAdd_planEndTime">结束日期:</label>           <div >             <input  ID="ConstructionPlanAdd_planEndTime" type="text" name="planEndTime" placeholder="请输入结束时间" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'ConstructionPlanAdd_planStartTime\');}',Readonly:true})"/>           </div> 

   我需要的效果是，当选择完日期后，可以实现bootstrapValIDator的自动校验，熟读my97的API后我发现这个onpicked 事件对我有用，于是我添加了onpicked 事件。代码变成这样:

<label  for="ConstructionPlanAdd_planStartTime">开始时间:</label>           <div >             <input  ID="ConstructionPlanAdd_planStartTime" name="planStartTime" type="text" placeholder="请选择开始时间" onFocus="WdatePicker({maxDate:'#F{$dp.$D(\'ConstructionPlanAdd_planEndTime\');}',Readonly:true,onpicked:checkPlanStartTime(this)})"/>           </div>           <label  for="ConstructionPlanAdd_planEndTime">结束日期:</label>           <div >             <input  ID="ConstructionPlanAdd_planEndTime" type="text" name="planEndTime" placeholder="请输入结束时间" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'ConstructionPlanAdd_planStartTime\');}',onpicked:checkPlanEndTime(this)})"/>           </div> 

   所以此时我们需要在Js中定义函数:

function checkPlanStartTime(obj) {   if(obj.value!=null && obj.value!="" && obj.value!=undefined){     $("#ConstructionPlanAdd").data("bootstrapValIDator").updateStatus("planStartTime","NOT_VALIDATED",null).valIDateFIEld("planStartTime");   } } 

  于此同时，需要在页面提交事件加入日期的再次校验 

$('#ConstructionPlanAdd').bootstrapValIDator({     message: '您输入的值不合法!',FeedbackIcons: {       valID: 'glyphicon glyphicon-ok',invalID: 'glyphicon glyphicon-remove',valIDating: 'glyphicon glyphicon-refresh'     },//excluded:[":hIDden",":Disabled",":not(visible)"],//bootstrapValIDator的默认配置     excluded:[":Disabled"],//关键配置，表示只对于禁用域不进行验证，其他的表单元素都要验证     fIElds: {     planStartTime: {       message : "计划开始日期必须输入",valIDators : {         notEmpty : {           message : "计划开始日期不能为空"         },date : {           format : "yyyy-MM-dd",message : "计划开始日期格式不正确"         }       }     },planEndTime: {       message : "计划结束日期必须输入",valIDators : {         notEmpty : {           message : "计划结束日期不能为空"         },message : "计划结束日期格式不正确"         }       }     }   },submitHandler: function (valIDator,form,submitbutton) {     AJAXsubmit();   } }); 

这样既可完成bootstrapValIDator的与my97合体的日期校验。

    值得注意的是bootstrapValIDator的额外添加数据校验

$("#ConstructionPlanAdd").data("bootstrapValIDator").updateStatus("planEndTime",null).valIDateFIEld("planEndTime"); 

以上所述是小编给大家介绍的bootstrapValIDator与My97日期校验的实例代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对编程小技巧网站的支持！

总结

以上是内存溢出为你收集整理的BootStrapValidator与My97日期校验的实例代码全部内容，希望文章能够帮你解决BootStrapValidator与My97日期校验的实例代码所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。