BootstrapPlugin - daterangepicker 使用笔记

BootstrapPlugin - daterangepicker 使用笔记

1) 项目中间要用到选择日期范围的控件,因为是基于twitter-bootstrap框架的东西
找到一个插件，自己汉化一下。稍微修改一下源代码即可。(见本文附件)

2) 效果图
[img]http://dl.iteye.com/upload/picture/pic/119932/9cdac8ec-a41b-3aa1-be10-e7fd1fc95331.png[/img]
[img]http://dl.iteye.com/upload/picture/pic/119934/cd02fa6a-dad7-355c-b94d-1d4828296942.png[/img]

3) 因为后端使用的是spring-mvc框架，自己开发一个标注实现数据绑定。(不采用java.util.Date,依赖joda-time.jar)
[b]model:[/b]

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;
	}
}

[b]annotation:[/b]

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 " - ";

}

[b]AnnotationFormatterFactory[/b]

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);
		}
	}
}

[b]spring-mvc 配置[/b]

<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) 参考资料
[url=http://www.dangrossman.info/2012/08/20/a-date-range-picker-for-twitter-bootstrap/]插件官网[/url]
[url=http://jinnianshilongnian.iteye.com/blog/1508110]张开涛SpringMVC教程[/url]
[url=http://code.google.com/p/datejs/]bootstrap-daterangepicker.js依赖的date.js官方教程[/url]