JadePool应用范例:实现中国行政区划管理
这里使用JSF2.0技术实现中国行政区划管理,通过范例可以看到JadePool实现了与JSF框架和Primefaces的完美组合。本范例完整演示了以下操作:1、导入中国大陆行政区划记录,并将记录保存到数据库中;2、实现多功能的分页查询;3、在DataTable行中修改行政区划记录。数据来源于国家统计局于2012年11月份公布的中国大陆行政区划。这些数据被打包在jadepool-1.0-GBK.jar文件中,可以通过cn.jadepool.util.China的division()方法导出。
一、修改模板文件
1、将模板文件IndexTemplate.xhtml中的<p:menuitem value="行政区划" url="#" />修改为:<p:menuitem value="中国行政区划" outcome="cn_address" />,outcome指向本系统内的一个JSF页面文件,不需要文件的后缀名。
2、增加一个导航到首页的菜单项<p:menuitem value="返回首页" outcome="index" icon="ui-icon-home"/>,icon用来在菜单项前增加一个图标。
3、在底部布局中,增加一个消息提示组件<p:growl/>,需要在<h:form/>中添加。代码如下:
附件1:IndexTemplate.xhtml
<?xml version='1.0' encoding='GBK' ?><!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><ui:composition xmlns:ui="http://java.sun.com/jsf/facelets" template="./IndexTemplate.xhtml" xmlns:p="http://primefaces.org/ui" xmlns:f="http://java.sun.com/jsf/core" xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:h="http://java.sun.com/jsf/html"> <ui:define name="content"> <h:form id="form"> <p:tabView id="tv" widgetVar="tv" dynamic="true"> <p:tab title="中国大陆行政区划管理"> <p:dataTable id="addressDataTable" value="#{addressBean.dimingModel}" var="m" rowIndexVar="i" paginator="true" paginatorPosition="bottom" rows="10" paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" rowsPerPageTemplate="10,15,20,25,30,35,40,45,50,55,60" selection="#{addressBean.dimingSelected}" selectionMode="single" editable="true" > <p:ajax event="rowEdit" listener="#{addressBean.onEdit}" update=":form:tv:addressDataTable :bottomForm:bottomGrowl" /> <p:ajax event="rowEditCancel" listener="#{addressBean.onCancel}" update=":form:tv:addressDataTable :bottomForm:bottomGrowl" /> <p:column headerText="序号" style="width:5%;text-align: center;"> #{i+1} </p:column> <p:column headerText="编号" style="width:8%;text-align: center;" sortBy="#{m.addresscode}" > #{m.addresscode} </p:column> <p:column headerText="标准名称" style="width:15%;" sortBy="#{m.addressname}" > #{m.addressname} </p:column> <p:column headerText="中文标签" style="width:8%;" sortBy="#{m.labelcn}"> <p:cellEditor> <f:facet name="output"> <h:outputText value="#{m.labelcn}" style="width:90%;"/> </f:facet> <f:facet name="input"> <p:inputText value="#{m.labelcn}" size="16"/> </f:facet> </p:cellEditor> </p:column> <p:column headerText="英文标签" style="width:8%;" sortBy="#{m.labelen}"> <p:cellEditor> <f:facet name="output"> <h:outputText value="#{m.labelen}" style="width:90%;"/> </f:facet> <f:facet name="input"> <p:inputText value="#{m.labelen}" size="16"/> </f:facet> </p:cellEditor> </p:column> <p:column headerText="经度" style="width:8%;" sortBy="#{m.longitude}"> <p:cellEditor> <f:facet name="output"> <h:outputText value="#{m.longitude}" style="width:90%;"/> </f:facet> <f:facet name="input"> <p:inputText value="#{m.longitude}" size="8"/> </f:facet> </p:cellEditor> </p:column> <p:column headerText="纬度" style="width:8%;" sortBy="#{m.latitude}"> <p:cellEditor> <f:facet name="output"> <h:outputText value="#{m.latitude}" style="width:90%;"/> </f:facet> <f:facet name="input"> <p:inputText value="#{m.latitude}" size="8"/> </f:facet> </p:cellEditor> </p:column> <p:column headerText="是否使用" style="width:5%;"> <p:cellEditor> <f:facet name="output"> <p:selectBooleanCheckbox value="#{m.isusing}" disabled="true"/> </f:facet> <f:facet name="input"> <p:selectBooleanCheckbox value="#{m.isusing}"/> </f:facet> </p:cellEditor> </p:column> <p:column style="width:5%;text-align: center;"> <p:rowEditor/> </p:column> <f:facet name="footer"> <h:panelGrid style="width: 500px;text-align: left;" columns="6" styleClass="my-grid"> <p:commandButton style="float: left;" value="全部" action="#{addressBean.queryDiming}" icon="ui-icon-search" update="@form"/> <p:commandButton style="float: left;" value="省级" action="#{addressBean.queryDimingSheng}" icon="ui-icon-search" update="@form"/> <p:selectOneMenu style="float: left;width:140px;" value="#{addressBean.codeSheng}"> <p:ajax update="@form" process="@this" listener="#{addressBean.codeShengChange}"/> <f:selectItem itemValue="" itemLabel="--请选择省级--"/> <c:forEach var="m" items="#{addressBean.dimingShengList}"> <f:selectItem itemValue="#{m.addresscode}" itemLabel="#{m.addressname}"/> </c:forEach> </p:selectOneMenu> <p:selectOneMenu style="float: left;width:140px;" value="#{addressBean.codeShi}"> <p:ajax update="@form" process="@this" listener="#{addressBean.codeShiChange}"/> <f:selectItem itemValue="" itemLabel="--请选择市级--"/> <c:forEach var="m" items="#{addressBean.dimingShiList}"> <f:selectItem itemValue="#{m.addresscode}" itemLabel="#{m.addressname}"/> </c:forEach> </p:selectOneMenu> <p:commandButton style="float: left;" value="查询" action="#{addressBean.queryDimingXian}" icon="ui-icon-disk" update="@form"/> </h:panelGrid> </f:facet> </p:dataTable> <div style="padding:2px;"><p:spacer height="2"/></div> </p:tab> <p:tab title="初始化行政区划记录"> <div style="padding: 40px;text-align: center;"> <p:commandButton style="float: left;" value="初始化地名" action="#{addressBean.reUpdateDiming}" icon="ui-icon-disk" update="@form :bottomForm:bottomGrowl"/> </div> </p:tab> </p:tabView> </h:form> </ui:define></ui:composition>