日期控件如何处理后台传回的Date类型的数据

最新推荐文章于 2022-10-31 16:22:10 发布
最新推荐文章于 2022-10-31 16:22:10 发布
阅读量3.1k 收藏 1
点赞数
分类专栏： JavaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qiushisoftware/article/details/89918725
版权

问题描述：

jsp中日期控件的定义如下

<td>
    <input type="text" id="certificateValidity"  name="certificateValidity" readonly="readonly" value="<fmt:formatDate value='${certificateValidity}' pattern="yyyy-MM-dd"/>" onfocus="WdatePicker()" class="Wdate"/> 
</td>

时间日期控件使用的是My97DatePicker，jsp中引入的时间控件js如下：

<script type="text/javascript" src="<%=basePath%>js/My97DatePicker/WdatePicker.js"></script>

在后台该字段对应的实体类中，certificateValidity的数据类型为String类型时，在jsp中的js代码里，使用如下一行代码即可将从后台传递过来的该字段的值，赋值给时间控件，没有问题。

$("#certificateValidity").val(data.certificateValidity);

现在，需要将后台该字段对应的实体类中，certificateValidity的数据类型修改为Date类型，此时，如果仍然使用上面一行代码给时间控件赋值的话，效果如下图所示。

问题分析：

在给时间控件赋值的js代码行上面一行，添加debugger

debugger;

这样在点击F12打开浏览器的调试模式后，执行到这一行js代码时，就会暂时停留在此处，此时，就可以进行js代码的调试。

在右侧工具条的Watch中，添加data.certificateValidity，可以实时查看到该变量值的变化

当js代码执行并停留在debugger；这一代码行时，查看此时Watch中该变量的值

解决方案：

date.js

       //获得日期和时间
  		function getTime(date){
			var YY =date.getFullYear();
			var MM = date.getMonth()+1;   
	            if(MM<10) MM = '0' + MM;   
	        var dd = date.getDate();   
	            if(dd<10) dd = '0' + dd;   
	        var hh = date.getHours();   
	            if(hh<10) hh = '0' + hh;   
	        var mm = date.getMinutes();   
	            if(mm<10) mm = '0' + mm;   
	        var ss = date.getSeconds();   
	            if(ss<10) ss = '0' + ss;
	         return  YY+"-"+MM+"-"+dd+" "+hh+":"+mm+":"+ss;
		}
  		
  		 //获得日期
  		function getDate(date){
			var YY =date.getFullYear();
			var MM = date.getMonth()+1;   
	            if(MM<10) MM = '0' + MM;   
	        var dd = date.getDate();   
	            if(dd<10) dd = '0' + dd;   
	       
	         return  YY+"-"+MM+"-"+dd;
		}

在jsp页面中引入该js

<%@ page language="java" import="java.util.*"   pageEncoding="UTF-8"  %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
	   <base href="<%=basePath %>">
       <script type="text/javascript" src="<%=basePath%>js/My97DatePicker/WdatePicker.js"> 
       </script>
       <script type="text/javascript" src="<%=basePath%>js/date.js"></script>

将给时间控件赋值的js修改为如下内容：

var date = new Date(data.certificateValidity.time);
$("#certificateValidity").val(getDate(date));

此时，时间控件内容显示正常，如下图

 

 

chenbinqq
关注
专栏目录
Realm-Android
...
11-10 4005
  Realm Java 让你能够高效地编写 app 的模型层代码，保证你的数据被安全、快速地存储。参考下列示例来开始你的 Realm 之旅： // Define you model class by extending RealmObject public class Dog extends RealmObject { private String name; pri...
Android开发笔记（一百零六）支付缴费SDK
aqi00的博客
06-15 1万+
第三方支付 第三方支付指的是第三方平台与各银行签约，在买方与卖方之间实现中介担保，从而增强了支付交易的安全性。国内常用的支付平台主要是支付宝和微信支付，其中支付宝的市场份额为71.5%，微信支付的市场份额为15.99%，也就是说这两家垄断了八分之七的支付市场（2015年数据）。除此之外，还有几个app开发会用到的支付平台，包括：银联支付，主要用于公共事业缴费，如水电煤、有线电视、移动电信等等的充
Date对象的处理
kids_fan的博客
12-16 1235
一、介绍 Date是一个时间对象，日期对象，。属于Javascript对象，也是内建对象。 Date对象用来处理日期和时间。 作为对象，肯定得有相应的属性，Date对象两个属性： 1. Constructor属性，返回创建此对象的Date函数引用。 2. 对象的原型prototype，通过原型你可以为其添加属性和方法。 二、Date对象方法 Date对象是常用的对象，作为程序猿的我们也很熟悉它。Date对象的方法有很多，我就介绍用的最多的，也是我要的介绍方法中用的。 1.首先，得创建Date对象不是？ V
日期在jsp的type表示_java web中日期Date类型在页面中格式化显示的三种方式
weixin_29064009的博客
01-13 716
一般我们经常需要在将服务器端的Date类型，传到页面进行显示，这就涉及到一个如何格式化显示Date类型的问题，一般我们有三种方式进行：1)在服务端使用SimpleDateFormat等类格式化成字符串，然后传给客户端，这样的话，需要将Date类型修改为String,或者增加一个String字段专门保存Date的字符串；2)使用jstl的fmt标签库进行格式化，缺点是只能在jsp页面中进行，html...
前端日期控件——My97DatePicker控件用法说明
IManiy的博客
09-24 704
My97DatePicker是一款功能强大的日期控件 先在官网下载控件包 官网下载地址：http://www.my97.net/down.asp 现在最新的版本是4.8 把控件包拷贝到项目中，js引用 本身写法是jQuery的把jQuery文件引入 &lt;script type="text/javascript" src="My97DatePicker/WdatePicker.js"...
My97DatePicker日期插件使用
king_qc的博客
12-05 686
1.首先下载JS插件，导入至项目中。 2.在html中引入js： &lt;script type="text/javascript" src="js/plugins/My97DatePicker/WdatePicker.js"&gt;&lt;/script&gt;  3.使用，onClick或者onfocus触发： &lt;input class="Wdate" name="per.
My97DatePicker日期控件的使用
LFSenior
10-17 636
2. 特色功能 平面显示 日期控件支持平面显示功能,只要设置一下eCont属性就可以把它当作日历来使用了,无需触发条件,直接显示在页面上 示例2-1 平面显示演示 div1"> WdatePicker({eCont:'div1',onpicked:function(dp){alert('你选择的日期是:'+dp.cal.getDateStr())}})
element-ui日期时间选择器的日期格式化问题
热门推荐
codecho的博客
04-06 1万+
最近在做vue+element-ui的后台管理页面，其中用到了DateTimePicker来选择日期时间，但是在将数据传回后台的过程中遇到了一些令人头疼的问题，在此记录一下解决方案，以免日后再次遇到。 前端代码 submitForm(formName) { this.$refs[formName].validate((valid) => {...
mysql 新闻内容_jeeplus+mysql实现新闻管理后台（最详细）
weixin_35120608的博客
01-19 422
最近前端菜鸟的我跟着做了一个项目，主要负责后台管理模块中的新闻管理模块，主要功能有新闻的增删改查，主要涉及到的一些控件有：自动填充的form表单，二级联动下拉框和富文本编辑器，接下来就把这次项目学习到的知识记录下来，算是复习一下，也方便以后有类似需求的同学借鉴。首先，我们这次使用的框架是jeeplus，虽然它的评价都不是很好，说它丑，还花钱，并且还是抄袭jeesite只是扒个皮，但其实在项目里我觉...
asp使用js时间控件，实现下拉日历 解决UTF-8和GB2312的编码问题
smx1989的专栏
01-02 2338
学校实训时发现，网上找到的js时间控件大部分是GB2312编码的，asp网页默认为UTF-8编码的，网上都说把网页编码改了才能正常能够使用。在Web.config中如下设置使用gb2312编码 或者在调用的js 脚本 的asp页面 加上： 其实还有一个更简单的方法！！！！ 用记事本打开js -- 另存为 -- 选择UTF-8编码！这样js脚本就可以正常的使用了。
JavaScript：My97DatePicker日期选择器组件的使用
qq_40435659的博客
09-18 449
  前言： 　　在实际项目开发中，日期选择是一个十分常见而且重要的问题，在表单中设计到日期的验证时，如果让用户自己输入时间的话，那么使用正则进行验证其正确性是不可取的，因为他一般只能验证日期的格式，无法准确的验证其日期正确性。此时可以使用日期选择器组件来帮助我们完整。   用法：     使用日期在选择其组件其实很简单，我们只需要在*.html文件里面引入日期选择器的*.js文件，并在i...
日历组件My97DatePicker的使用
qq_36994788的博客
12-10 455
My97DatePicker是一个非常使用的组件，它的界面组成为一个时间的下拉框，通过选择可以将下拉框中的日期加载到对应的文本框中，效果如下图所示一、My97DatePicker的使用过程1.自己可以去网上下载一个My97DatePicker的组件2.将解压后的文件之间拷贝到WebRoot目录下就行了3.接着我们就要对My97DatePicker进行配置了，首先对日历组件的显示页面进行配置，找到需要
My97DatePicker的使用
W_DongQiang的博客
06-15 391
今天项目中看到了一个很简洁，操作也很方便的时间控件，顺便收藏一下。My97DatePicker基本用法1.My97DatePicker是一款非常灵活好用的日期控件。使用非常简单。 1、下载My97DatePicker组件包 下载地址：http://download.csdn.net/detail/emoven/82490732、在页面中引入该组件js文件：     &lt;script type=...
日期信息存入mysql数据库
收破烂的小熊猫
01-14 1147
最近要制作一个人员信息，需要使用到My97DatePicker的日期控件，然后获取到选定的日期信息，调用loushang框架的后端cmd存入到数据库。 数据库表 person_info 可自行设计，只使用到create_time 字段 注意：create_time (创建时间) 类型为date 前端页面 ： //引入My97DatePicker控件的js 可自行去百度下...
只需两步带你轻松使用My97DatePicker日期控件
weixin_56912303的博客
10-31 635
只需两步带你轻松使用My97DatePicker日期控件
【笔记】扩展mvc消息转换器
weixin_52226593的博客
02-26 1502
@Configuration public class WebMvcConfig implements WebMvcConfigurer { /** * 扩展mvc的消息转换器 * @param converters */ @Override public void extendMessageConverters(List<HttpMessageConverter<?>> converters) { log.i.
关于jquery中WdatePicker时间插件的提交问题
dangwanma6489的博客
08-07 884
时间格式 （环境mvc+hibernate）通过WdatePicker获取时间后，通过表单提交数据，发现问题：代码是通过实体绑定的date字段，form表达如果通过对象转为json格式将时间传入后台，时间解析错误无法直接保存数据库。此时应将前台的时间脱离后台绑定（name属性取消），然后再通过form表达提交前将获得的时间进行转化保存，再传入后台接受，此时接收类型为字符串，在后台通过Simpl...
前后台Date类型数据处理
EmiyaGm的专栏
11-08 7622
前台传Date类型数据所导致的一系列问题前台js传过来的Date类型的数据格式默认为： Fri Nov 18 2016 00:00:00 GMT+0800 (中国标准时间) 传给后台使用Java.util.Date类型的属性进行获取的时候也存储为这个格式，这就使在dao层拼接成sql语句的时候，处理不好之中的空格，导致语句执行时出现问题。 所以在后台对此进行处理 方法： 使用Java8新特
JavaScript日期处理与My97日历控件
在JavaScript中，日期处理是编程中常见的需求，`Date`对象是JavaScript内置的对象类型，用于处理日期和时间。`Date`对象提供了多种方法来创建、读取、操作日期。例如，可以通过`new Date()`创建一个表示当前日期和...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值