BootstrapPlugin - daterangepicker 使用笔记
1) 项目中间要用到选择日期范围的控件,因为是基于twitter-bootstrap框架的东西
找到一个插件,自己汉化一下。稍微修改一下源代码即可。(见本文附件)
2) 效果图
3) 因为后端使用的是spring-mvc框架,自己开发一个标注实现数据绑定。(不采用java.util.Date,依赖joda-time.jar)
model:
package com.ztgame.me.ext.model.datetimerange;
import java.io.Serializable;
import org.joda.time.DateTime;
public class DateTimeRange implements Serializable {
private static final long serialVersionUID = 7099749496174999964L;
private DateTime startDateTime;
private DateTime endDateTime;
// ------------------------------------------------------------------------------------
// 构造方法
public DateTimeRange() {
super();
}
public DateTimeRange(DateTime startDateTime, DateTime endDateTime) {
this();
this.startDateTime = startDateTime;
this.endDateTime = endDateTime;
}
// ------------------------------------------------------------------------------------
public DateTime getStartDateTime() {
return startDateTime;
}
public void setStartDateTime(DateTime startDateTime) {
this.startDateTime = startDateTime;
}
public DateTime getEndDateTime() {
return endDateTime;
}
public void setEndDateTime(DateTime endDateTime) {
this.endDateTime = endDateTime;
}
}
annotation:
package com.ztgame.me.ext.model.datetimerange;
import java.lang.annotation.Documented;
import java.lang.annotation.ElementType;
import java.lang.annotation.Retention;
import java.lang.annotation.RetentionPolicy;
import java.lang.annotation.Target;
@Documented
@Target({ ElementType.METHOD, ElementType.FIELD, ElementType.PARAMETER })
@Retention(RetentionPolicy.RUNTIME)
public @interface DateTimeRangeFormat {
public String pattern() default "yyyy/MM/dd";
public String delimiter() default " - ";
}
AnnotationFormatterFactory
package com.ztgame.me.ext.model.datetimerange;
import java.io.Serializable;
import java.text.ParseException;
import java.util.HashSet;
import java.util.Locale;
import java.util.Set;
import org.joda.time.DateTime;
import org.joda.time.format.DateTimeFormat;
import org.joda.time.format.DateTimeFormatter;
import org.springframework.format.AnnotationFormatterFactory;
import org.springframework.format.Formatter;
import org.springframework.format.Parser;
import org.springframework.format.Printer;
public class DateTimeRangeFormatAnnotationFormatterFactory implements AnnotationFormatterFactory<DateTimeRangeFormat> {
@Override
public Set<Class<?>> getFieldTypes() {
Set<Class<?>> fieldTypes = new HashSet<Class<?>>();
fieldTypes.add(DateTimeRange.class);
return fieldTypes;
}
@Override
public Printer<?> getPrinter(DateTimeRangeFormat annotation, Class<?> fieldType) {
return new DateTimeRangeFormatter(annotation.pattern(), annotation.delimiter());
}
@Override
public Parser<?> getParser(DateTimeRangeFormat annotation, Class<?> fieldType) {
return new DateTimeRangeFormatter(annotation.pattern(), annotation.delimiter());
}
// ~============================================================================================================================
private static class DateTimeRangeFormatter implements Formatter<DateTimeRange>, Serializable {
private static final long serialVersionUID = -818656464607971661L;
private String delimiter;
private String pattern;
public DateTimeRangeFormatter(String pattern, String delimiter) {
this.pattern = pattern;
this.delimiter = delimiter;
}
@Override
public String print(DateTimeRange object, Locale locale) {
StringBuilder sb = new StringBuilder();
sb.append(object.getStartDateTime().toString(pattern));
sb.append(delimiter);
sb.append(object.getEndDateTime().toString(pattern));
return sb.toString();
}
@Override
public DateTimeRange parse(String text, Locale locale) throws ParseException {
String[] ps = text.split(delimiter);
DateTimeFormatter format = DateTimeFormat.forPattern(pattern);
DateTime startDateTime = format.parseDateTime(ps[0]);
DateTime endDateTime = format.parseDateTime(ps[1]);
return new DateTimeRange(startDateTime, endDateTime);
}
}
}
spring-mvc 配置
<bean id="conversion-service" class="org.springframework.format.support.FormattingConversionServiceFactoryBean">
<property name="converters">
<list>
<!-- 其他自己实现的converter,跟本列子无关 -->
</list>
</property>
<property name="formatters">
<list>
<bean class="com.ztgame.me.ext.model.datetimerange.DateTimeRangeFormatAnnotationFormatterFactory" />
</list>
</property>
</bean>
这样一来,就可以吧诸如"1985/06/22 - 2012/11/13"这样的字符串直接绑定到DateTimeRange类上,很方便。
4) 参考资料
插件官网
张开涛SpringMVC教程
bootstrap-daterangepicker.js依赖的date.js官方教程