Web报表工具JS开发之日期校验

简介:

在报表开发过程中,我们常常需要对查询界面进行日期校验。例如有两个参数:开始日期和结束日期,我们要校验的是:开始日期与结束日期不能为空,结束日期必须在开始日期之后以及结束日期必须在开始日期后的某个时间段内,否则提示相关信息,对此可以在查询按钮中增加事件。下面我们通过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 = newDate(start);   //将开始日期转化为Date型
var enddate = newDate(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浏览器版本中,判断两个日期之间的差值的警告框则不会起作用。可以换用以下代码:

 

}




本文转自 雄霸天下啦 51CTO博客,原文链接:http://blog.51cto.com/10549520/1772251,如需转载请自行联系原作者

相关文章
|
15天前
|
监控 JavaScript 前端开发
《理解 WebSocket:Java Web 开发的实时通信技术》
【4月更文挑战第4天】WebSocket是Java Web实时通信的关键技术,提供双向持久连接,实现低延迟、高效率的实时交互。适用于聊天应用、在线游戏、数据监控和即时通知。开发涉及服务器端实现、客户端连接及数据协议定义,注意安全、错误处理、性能和兼容性。随着实时应用需求增加,WebSocket在Java Web开发中的地位将更加重要。
|
25天前
|
开发框架 JavaScript 安全
js开发:请解释什么是Express框架,以及它在项目中的作用。
Express是Node.js的Web开发框架,简化路由管理,支持HTTP请求处理。它采用中间件系统增强功能,如日志和错误处理,集成多种模板引擎(EJS、Jade、Pug)用于HTML渲染,并提供安全中间件提升应用安全性。其可扩展性允许选用合适插件扩展功能,加速开发进程。
|
25天前
|
缓存 JavaScript 前端开发
js开发:请解释什么是Webpack,以及它在项目中的作用。
Webpack是开源的JavaScript模块打包器,用于前端项目构建,整合并优化JavaScript、CSS、图片等资源。它实现模块打包、代码分割以提升加载速度,同时进行资源优化和缓存。借助插件机制扩展功能,并支持热更新,加速开发流程。
17 4
|
25天前
|
缓存 JavaScript 数据安全/隐私保护
js开发:请解释什么是ES6的Proxy,以及它的用途。
`ES6`的`Proxy`对象用于创建一个代理,能拦截并自定义目标对象的访问和操作,应用于数据绑定、访问控制、函数调用的拦截与修改以及异步操作处理。
17 3
|
3天前
|
开发框架 前端开发 JavaScript
采用C#.Net +JavaScript 开发的云LIS系统源码 二级医院应用案例有演示
技术架构:Asp.NET CORE 3.1 MVC + SQLserver + Redis等 开发语言:C# 6.0、JavaScript 前端框架:JQuery、EasyUI、Bootstrap 后端框架:MVC、SQLSugar等 数 据 库:SQLserver 2012
|
3天前
|
PHP
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
web简易开发——通过php与HTML+css+mysql实现用户的登录,注册
|
4天前
|
前端开发 数据挖掘 API
使用Python中的Flask框架进行Web应用开发
【4月更文挑战第15天】在Python的Web开发领域,Flask是一个备受欢迎的轻量级Web框架。它简洁、灵活且易于扩展,使得开发者能够快速地构建出高质量的Web应用。本文将深入探讨Flask框架的核心特性、使用方法以及在实际开发中的应用。
|
7天前
|
JavaScript 前端开发 API
Vue.js:构建高效且灵活的Web应用的利器
Vue.js:构建高效且灵活的Web应用的利器
|
16天前
|
XML JSON JavaScript
使用JSON和XML:数据交换格式在Java Web开发中的应用
【4月更文挑战第3天】本文比较了JSON和XML在Java Web开发中的应用。JSON是一种轻量级、易读的数据交换格式,适合快速解析和节省空间,常用于API和Web服务。XML则提供更强的灵活性和数据描述能力,适合复杂数据结构。Java有Jackson和Gson等库处理JSON,JAXB和DOM/SAX处理XML。选择格式需根据应用场景和需求。
|
25天前
|
Web App开发 JavaScript 前端开发
js开发:请解释什么是Node.js,以及它的应用场景。
Node.js是基于V8的JavaScript运行时,用于服务器端编程。它的事件驱动、非阻塞I/O模型使其在高并发实时应用中表现出色,如Web服务器、实时聊天、API服务、微服务、工具和跨平台桌面应用(使用Electron)。适用于高性能和实时需求场景。
18 4