Wicket 下实现 Checkin 和 Checkout 日期的连动
Shrimpy 的推荐果然不虚, Wicket 确实是一个实现 Presentation Layer 的好框架。靠着 Wicket,整个 HTML 的静态代码和 Java 的动态代码可以完全分割开来。静态代码用 HTML 文件保存,动态代码使用 Java 格式, Wicket 自身便做将 HTML 和 Java 在后台绑定的工作——整个思路有点像 ASP.net,一个 C# 文件对应一个页面——关键是, Wicket 还能实现 AJAX 功能。相当地帅。
用着顺手,便在最近的项目中向老板推荐了 Wicket。于是,一个带薪尝试 Wicket 的机会便产生了……
不过,作为一个新的框架,相关资料实在是太少了……整个项目过程,一半靠 Wicket Example,一半靠 Google。
这个 Checkin 和 Checkout 日期连动的代码,就是靠着瞎蒙鼓捣出来的。很多网站的搜索都需要实现当前日期,起始日期和结束日期的连动,以保证当前日期>起始日期>结束日期。放出代码来供大家参考,如果有其他好思路,也请赐教。
HTML 部分代码
用着顺手,便在最近的项目中向老板推荐了 Wicket。于是,一个带薪尝试 Wicket 的机会便产生了……
不过,作为一个新的框架,相关资料实在是太少了……整个项目过程,一半靠 Wicket Example,一半靠 Google。
这个 Checkin 和 Checkout 日期连动的代码,就是靠着瞎蒙鼓捣出来的。很多网站的搜索都需要实现当前日期,起始日期和结束日期的连动,以保证当前日期>起始日期>结束日期。放出代码来供大家参考,如果有其他好思路,也请赐教。
HTML 部分代码
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:wicket="http://wicket.sourceforge.net/">
<head>
<title>Related Date Pickers</title>
</head>
<body>
<center><h1><span wicket:id="message">message will be here</span></h1></center>
<form wicket:id="dateForm">
<table align="center" id="dateForm">
<tr><td><input type="text" readonly="readonly" wicket:id="checkInDate" /></td></tr>
<tr><td><input type="text" readonly="readonly" wicket:id="checkOutDate" /></td></tr>
<tr></tr>
<tr><td align="center"><input type="submit" value="Submit" /></td></tr>
</table>
</form>
<div align="center" id="feedbackPanel">
<span wicket:id="feedback"/>
</div>
</body>
</html>Java 部分代码package info.liangz.RelatedDatePickers;
import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Date;
import java.util.Map;
import org.apache.wicket.PageParameters;
import org.apache.wicket.ajax.AjaxRequestTarget;
import org.apache.wicket.ajax.form.AjaxFormComponentUpdatingBehavior;
import org.apache.wicket.datetime.StyleDateConverter;
import org.apache.wicket.datetime.markup.html.form.DateTextField;
import org.apache.wicket.extensions.yui.calendar.DatePicker;
import org.apache.wicket.markup.html.basic.Label;
import org.apache.wicket.markup.html.WebPage;
import org.apache.wicket.markup.html.form.Form;
import org.apache.wicket.markup.html.panel.FeedbackPanel;
import org.apache.wicket.model.PropertyModel;
/**
* Homepage
*/
public class RelatedDatePickers extends WebPage {
private static final long serialVersionUID = 1L;
private Date selectedCheckInDate, selectedCheckOutDate;
private static final SimpleDateFormat format = new SimpleDateFormat("MM/dd/yyyy");
/**
* Constructor that is invoked when page is invoked without a session.
*
* @param parameters
* Page parameters
*/
public RelatedDatePickers(final PageParameters parameters) {
final DateTextField checkInDate = new DateTextField("checkInDate", new PropertyModel(
this, "selectedCheckInDate"), new StyleDateConverter("S-", true));
final DateTextField checkOutDate = new DateTextField("checkOutDate", new PropertyModel(
this, "selectedCheckOutDate"), new StyleDateConverter("S-", true));
add(new Label("message", "Related Date Pickers"));
Form form = new Form("dateForm") {
@Override
protected void onSubmit() {
info("Checkin Date is: " + selectedCheckInDate +
" & Checkout Date is: " + selectedCheckOutDate);
}
};
add(form);
form.add(checkInDate);
checkInDate.setRequired(true);
checkInDate.add(new DatePicker() {
@Override
protected void configure(Map widgetProperties) {
Date date;
if (selectedCheckInDate != null) {
date = selectedCheckInDate;
} else {
date = new Date();
}
// set minimal date
widgetProperties.put("mindate", format.format(date));
super.configure(widgetProperties);
}
});
checkInDate.add(new AjaxFormComponentUpdatingBehavior("onchange") {
@Override
protected void onUpdate(AjaxRequestTarget target) {
target.addComponent(checkOutDate);
}
});
form.add(checkOutDate);
checkOutDate.setRequired(true);
checkOutDate.add(new DatePicker() {
@Override
protected void configure(Map widgetProperties) {
Date date;
if (selectedCheckInDate != null) {
Calendar cal = Calendar.getInstance();
cal.setTime(selectedCheckInDate);
cal.add(Calendar.DATE, 1);
date = cal.getTime();
} else {
date = new Date();
}
// set minimal date
widgetProperties.put("mindate", format.format(date));
super.configure(widgetProperties);
}
});
checkOutDate.setOutputMarkupId(true);
add(new FeedbackPanel("feedback"));
}
}以及一张效果图![]() |
| Related Date Pickers |
