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 |