关于datetimepicker 使用遇到的问题总结

一、datetimepicker与实体的关系

关系说明

datetimepicker 返回的是一个String类型的值,在实体中的定义类型可以是Date或TimeStamp,对应数据库中字段类型是datetime

问题说明

在进行保存的时候,发生400 bad request错误,一般原因就是“ 提交的字段类型后台接收字段类型不匹配造成的”;

处理办法

第一步:

在实体中使用注解@DateTimeFormat(pattern="yyyy-MM-dd HH:mm:ss");

@DateTimeFormat(pattern="yyyy-MM-dd HH:mm:ss")
private Timestamp beginTime;	

第二步:

在jsp页面中对于datetimepicker中的显示格式进行转换,此处我使用了jstl标签库的格式化标签,即如下面代码所示的标签;


"								 	onclick="initDateTimePicker(this)" onkeydown="return false;">


//js:
function initDateTimePicker(datetime){
    $(datetime).datetimepicker({
        format: 'yyyy-mm-dd hh:ii:ss',
        language: 'zh-CN',
	autoclose: true,
	startView : 2
    });
    $(datetime).datetimepicker('show');
}

第三步:

在datetimepicker的初始化中,定义了datetimepicker的format,注意它的格式与实体的格式不同;

datetimepicker的format="yyyy-mm-dd hh:ii:ss"

实体的pattern="yyyy-MM-dd HH:mm:ss"

二、datetimepicker 实现开始时间小于结束时间

1. 首先是开始时间和结束时间的Html

" onclick="initDateTimePicker(this)" onkeydown="return false;">
" onclick="initDateTimePicker(this)" onkeydown="return false;">

2. 然后js的实现

        $("#begintime").datetimepicker({
		format: 'yyyy-mm-dd hh:ii:ss',
		language: 'zh-CN',
		autoclose: true,
		startView : 2
	}).on('changeDate', function(event) {
		event.preventDefault();
		event.stopPropagation();
		var begintime=$("#begintime").val();
		$("#endtime").datetimepicker('setStartDate',begintime);
		$("#endtime").val("");
	});
	$("#endtime").datetimepicker({
		format: 'yyyy-mm-dd hh:ii:ss',
		language: 'zh-CN',
		autoclose: true,
		startView : 2,
	}).on('changeDate', function(event) {
		event.preventDefault();
		event.stopPropagation();
		var endtime=$("#endtime").val();
		$("#begintime").datetimepicker('setEndDate',endtime);
	});

3. 之前出现过的问题

$("#begintime").datetimepicker('setEndDate',event.date);

使用到了event.date来获取选中的时间,这样依赖就会出现开始时间与结束时间相差8个小时的问题。

 

你可能感兴趣的:(关于datetimepicker 使用遇到的问题总结)