在报表开发过程中,我们常常需要对查询界面进行日期校验。例如有两个参数:开始日期和结束日期,我们要校验的是:开始日期与结束日期不能为空,结束日期必须在开始日期之后以及结束日期必须在开始日期后的某个时间段内,否则提示相关信息,对此可以在查询按钮中增加事件。下面我们通过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;
}

Web报表工具JS开发之日期校验的更多相关文章

  1. 设计与开发一款简单易用的Web报表工具(支持常用关系数据及hadoop、hbase等)

    EasyReport是一个简单易用的Web报表工具(支持Hadoop,HBase及各种关系型数据库),它的主要功能是把SQL语句查询出的行列结构转换成HTML表格(Table),并支持表格的跨行(Ro ...

  2. web报表工具FineReport常用函数的用法总结(日期和时间函数)

    web报表工具FineReport常用函数的用法总结(日期和时间函数) 说明:凡函数中以日期作为参数因子的,其中日期的形式都必须是yy/mm/dd.而且必须用英文环境下双引号(" " ...

  3. web报表工具FineReport经常使用函数的使用方法总结(日期和时间函数)

    web报表工具FineReport经常使用函数的使用方法总结(日期和时间函数) 说明:凡函数中以日期作为參数因子的,当中日期的形式都必须是yy/mm/dd.并且必须用英文环境下双引號(" & ...

  4. web报表工具FineReport最经常用到部分函数详解

    之前分别列出来了finereport常用的文本.时间函数的解释,这里应广大朋友的要求,整理了finereport最常用到的一些函数! SUM SUM(number1,number2,-):求一个指定单 ...

  5. 开源报表工具太复杂?不如用这款免费web报表工具

    随着信息系统的高速发展,报表平台逐渐成为了信息系统当中最为核心和重要的功能模块.报表工具有助于将原始数据可视化显示,使决策者或者相关人员能够一览整体的数据趋势,完整的报表解决方案会提供多样的表格数据展 ...

  6. web报表工具FineReport使用中遇到的常见报错及解决办法(二)

    web报表工具FineReport使用中遇到的常见报错及解决办法(二) 这里写点抛砖引玉,希望大家能把自己整理的问题及解决方法晾出来,Mark一下,利人利己. 出现问题先搜一下文档上有没有,再看看度娘 ...

  7. web报表工具Stimulsoft Reports.Web在mvc项目中使用

    Stimulsoft Reports.Web,是一款可以直接在Web中编辑报表的报表工具 web项目技术框架mvc4+easyui+knockoutjs 1.在项目中添加引用 Stimulsoft.B ...

  8. 国内专业web报表工具,完美解决中国式报表难题

    近几年报表工具的热度不断上升,很多企业都用上了全新的报表工具,主要是企业数据化转型已经成为趋势.在进行选型的时候,很多企业最好都选择国内的报表工具,相信一些人不知道为什么国内的报表工具表现比国外的好. ...

  9. Web报表工具FineReport中JavaScript的使用

    报表软件FineReport采用的是jQuery v1.9.2框架,jQuery是一个快速的,简洁的JavaScript库,能让用户更方便地处理HTML documents.events,实现动画效果 ...

随机推荐

  1. JavaScript 控制字体大小设置

    在做公司的官网的时候,新闻内页会有一个让浏览者自己调整文字大小的功能,因此在这个空闲时间,把这个功能整理下来: function setFontSize (id,content,params){ va ...

  2. C# ~ 从 委托事件 到 观察者模式 - Observer

    委托和事件的部分基础知识可参见 C#/.NET 基础学习 之 [委托-事件] 部分: 参考 [1]. 初识事件 到 自定义事件: [2]. 从类型不安全的委托 到 类型安全的事件: [3]. 函数指针 ...

  3. 云巴:基于MQTT协议的实时通信编程模型

    概要 有人常问,云巴实时通信系统到底提供了一种怎样的服务,与其他提供推送或 IM 服务的厂商有何本质区别.其实,从技术角度分析,云巴与其它同类厂商都是面向开发者的通信服务,宏观的编程模型都是大同小异, ...

  4. mybatis中的查询缓存

    一: 查询缓存 Mybatis提供查询缓存,用于减轻数据压力,提高数据库压力. Mybatis提供一级缓存和二级缓存. 在操作数据库时需要构造SqlSession对象,在对象中有一个数据结构(Hash ...

  5. HashTable(散列表)

    最近都在研究数据结构,关于hashtable,或者叫做散列表,过去一直不了解是什么东西,现在终于明白了. 所谓hashtable,就是某组key,通过某个关系(函数),得到一个与之对应的映射值(在计算 ...

  6. Netty(六)UDP在netty中的使用

    关于UDP的介绍,这里不在阐述.相比于TCP而言,UDP不存在客户端和服务端的实际链接,因此不需要为连接(ChannelPipeline)设置handler. 服务端: public void run ...

  7. Disruptor-net 3.3.0

    Disruptor 介绍 Disruptor 是LMX开源出来的java编写的一个并发消息处理器,在队列中一边生产者放入消息,另外一边消费者并行取出处理,其核心是根据现代CPU硬件缓存特点发明不同于通 ...

  8. 程序员用HTML5给女朋友制作的3D相册

    程序员给女朋友用HTML5制作的3D相册,使用鼠标拖拽,能看到3D旋转效果,点击相片,相片能放大,移近.程序员发挥自己的专长,这是那些不懂编程的人望尘莫及的.本相册使用了HTML5的画布技术,需要谷歌 ...

  9. Ajax实现简单下拉选项

    基本都是固定步骤!主要在JAVASCRIPT和PHP中的操作 1.HTML代码里就只有两个SELECT标签如下: <select id="province"> < ...

  10. jQuery基础知识总结

    1.  jQuery基本概念介绍             1.1 什么是jQuery 一个javascript库,把常用方法写到一个js文件中,需要的时候直接调用即可 学习jQuery就是学习一些方法 ...