Web报表工具JS开发之日期校验
来源:互联网 发布:手机复制软件下载 编辑:程序博客网 时间:2024/05/16 12:30
在报表开发过程中,我们常常需要对查询界面进行日期校验。例如有两个参数:开始日期和结束日期,我们要校验的是:开始日期与结束日期不能为空,结束日期必须在开始日期之后以及结束日期必须在开始日期后的某个时间段内,否则提示相关信息,对此可以在查询按钮中增加事件。下面我们通过FineReport来介绍下具体的设置。
具体效果图如下:
可以看出会报出如下错误。
模板的设计工作这边就不重点讲了,设定好如下的模板界面:
给查询按钮增加点击事件,具体的JS代码如下:
var start = this.options.form.getWidgetByName("starttime").getValue(); var end = this.options.form.getWidgetByName("endtime").getValue(); if( start == "" || start==null){ //判断开始日期是否为空 alert("错误,开始时间不能为空"); //开始日期参数为空时提示 return false; }; if(end == "" || end==null){ //判断结束日期是否为空 alert("错误,结束时间不能为空"); //结束日期参数为空时提示 return false; }; if( start > end){ //判断开始日期是否大于结束日期 alert("错误,开始时间不能大于结束时间"); //开始日期大于结束日期时提示 return false; }var startdate = new Date(start); //将开始日期转化为Date型var enddate = new Date(end); //将结束日期转化成Date型var subdate = (enddate-startdate)/ (1000 *60 *60 *24); //将两个日期相减得出的毫秒数转化为天数if(subdate>15){ //判断结束日期是否超过开始日期后15天alert("错误,结束日期必须在开始日期15天之内"); //结束日期超过开始日期后的十五天时提示return false;}
虽然在参数控件中也可以设置校验,但是参数控件要点击控件后才能进行校验,因此参数界面的不能为空以及比较校验需要在查询按钮中设置,所以倒不如全放在查询按钮中进行校验。
设置完查看模板,选择开始时间和结束时间,使这两个日期之间相差超过15天,就会弹出上述对话框。
因为FineReport的报表界面是在前段展示,我特地把各种浏览器试了个遍。刚刚上述的js代码在火狐,谷歌IE9等浏览器下没有问题,但是在IE8以及IE8以下的IE浏览器版本中,判断两个日期之间的差值的警告框则不会起作用。可以换用以下代码:
var start = this.options.form.getWidgetByName("starttime").getValue(); var end = this.options.form.getWidgetByName("endtime").getValue(); if( start == "" || start==null){ //判断开始日期是否为空 alert("错误,开始时间不能为空"); //开始日期参数为空时提示 return false; }; if(end == "" || end==null){ //判断结束日期是否为空 alert("错误,结束时间不能为空"); //结束日期参数为空时提示 return false; }; if( start > end){ //判断开始日期是否大于结束日期 alert("错误,开始时间不能大于结束时间"); //开始日期大于结束日期时提示 return false; } var aDate = start.split("-") var startdate = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0]) //转换为MM-dd-yyyy格式 alert(startdate);var aDate = end.split("-") var enddate = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0]) alert(enddate);var subdate= ((enddate - startdate) /1000/ 60/60/24) //把相差的毫秒数转换为天数 alert(subdate);if(subdate>15){ //判断结束日期是否超过开始日期后15天 alert("错误,结束日期必须在开始日期15天之内"); //结束日期超过开始日期后的十五天时提示 return false; }
11 0
- Web报表工具JS开发之日期校验
- 报表制作工具日期参数校验之二
- 报表制作工具日期参数校验之一
- Web报表工具FineReport的JS API开发(一)
- Web报表工具FineReport的JS API开发(二)
- Web报表工具FineReport二次开发JS之字符串
- 报表开发工具 web Java报表工具 企业级Web报表工具
- js日期校验
- web开发(五)之struts校验
- java开发之js网页校验
- Java Web 报表工具
- 日期字符串合法性js校验
- js 正则表达式校验日期
- js校验电话、传真、日期
- MD5校验工具开发
- JS报表工具
- 报表工具 js Highcharts
- 关于JS生成日期和校验日期
- iOS下PDF显示
- 深入浅出RxJava——在Android中使用响应式编程
- 2016校招内推 -- 阿里巴巴前端 -- 四面面试经历
- 【第六章】 AOP 之 6.6 通知参数 ——跟我学spring3
- iOS UIDevice设备信息,传感器设置,横竖屏判断操作,手机电池操作
- Web报表工具JS开发之日期校验
- 【BZOJ3873】[Ahoi2014]拼图【分类讨论】【暴力】
- 从Google与eBay的系统架构学到的经验
- 一些常用的jQuery插件
- 原根
- OkHttp介绍
- Dobbo的继任者?试用微博RPC框架Motan
- Servlet——Session(2)之简单应用
- 身份证号码校验