<tr>
<td height="27" align="right" class="textAnmedia" bgcolor="#E7F0F7">请选择省份:</td>
<td height="27" align="left" class="textAnmedia" bgcolor="#E7F0F7">
<select id="province" name="province" style="width: 380px;">
<option value="-1" >请选择...</option>
<beans:tagHandle id="tagProvince">
<database:prepareQuery id="<%=tagProvince%>" scope="page">
select id,city_code,city_name from tb_area_city where leve = 1
</database:prepareQuery>
<database:rows id="db2" query='<%=tagProvince%>'>
<option value="<%=db2.get("id") %>,<%=db2.get("city_name") %>" ><%=db2.get("city_name") %></option>
</database:rows>
<database:release query='<%=tagProvince%>'/>
</beans:tagHandle>
</select>
<span id="provinceTip"></span>
</td>
</tr>
<tr>
<td height="27" align="right" class="textAnmedia" bgcolor="#E7F0F7">请选择城市:</td>
<td height="27" align="left" class="textAnmedia" bgcolor="#E7F0F7">
<select id="city" name="city" style="width: 380px;">
<option value="-1" >请选择...</option>
</select>
<span id="cityTip"></span>
</td>
</tr>
<tr>
<td height="27" align="right" class="textAnmedia" bgcolor="#E7F0F7">请选择区/县:</td>
<td height="27" align="left" class="textAnmedia" bgcolor="#E7F0F7">
<select id="areaCountry" name="areaCountry" style="width: 380px;">
<option value="-1" >请选择...</option>
</select>
<span id="areaCountryTip" style="color: red"></span>
</td>
</tr>
$(document).ready(function() {
//根据省选择市
$("#province").change(function(){
//清空城市
document.getElementById("city").options.length=0;
//清空区/县
document.getElementById("areaCountry").options.length=0;
$("#areaCountry").append("<option value='-1'>请选择...</option>");
if($("#province").val() == '-1' || $("#province").val().split(',')[0] == '-1') {
$("#city").append("<option value='-1'>请选择...</option>");
}
//请求结果
$.post('areaLinkage.do',{
//参数一
flag: 'province',
//参数二
province_id: $('#province').val().split(',')[0]
},
//回调函数
function(result) {
$(result).find("entry").each(function(i){
var optionText = $(this).find("optionText").text();
var optionValue = $(this).find("optionValue").text();
var option = new Option(optionText,optionValue);
$("#city").append("<option value="+optionText +"," + optionValue +">"+optionValue+"</option>");
});
},
//返回类型
"xml"
);
});
//根据市选择县
$("#city").change(function(){
//清空区/县
document.getElementById("areaCountry").options.length=0;
if($("#city").val() == '-1' || $("#city").val().split(',')[0] == '-1') {
$("#areaCountry").append("<option value='-1'>请选择...</option>");
}
//请求结果
$.post('areaLinkage.do',{
//参数一
flag: 'city',
//参数二
city_id: $('#city').val().split(',')[0]
},
//回调函数
function(result) {
$(result).find("entry").each(function(i){
var optionText = $(this).find("optionText").text();
var optionValue = $(this).find("optionValue").text();
var option = new Option(optionText,optionValue);
$("#areaCountry").append("<option value="+optionText +"," + optionValue +">"+optionValue+"</option>");
});
},
//返回类型
"xml"
);
});
});
public class AreaLinkageAction extends Action {
/**
* 实现二级联动
*/
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws IOException {
response.setContentType("text/xml; charset=utf-8");
response.setHeader("Pragma", "No-cache");
response.setDateHeader("Expires", 0);
response.setHeader("Cache-Control", "no-cache");
PrintWriter out = response.getWriter();
AreaLinkageDao dao = new AreaLinkageDao();
List list = new ArrayList();
StringBuilder strXML = new StringBuilder();
try {
String para = "";
if (request.getParameter("flag").equals("province")) {
para = request.getParameter("province_id");
} else if (request.getParameter("flag").equals("city")) {
para = request.getParameter("city_id");
}
list = dao.areaLinkage(para, this.getServlet().getServletContext());
strXML.append("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
strXML.append("<selectChoice>");
if (list.size() > 0) {
strXML.append("<entry>");
strXML.append("<optionText>");
strXML.append("-1");
strXML.append("</optionText>");
strXML.append("<optionValue>");
strXML.append("请选择...");
strXML.append("</optionValue>");
strXML.append("</entry>");
for (Iterator it = list.iterator(); it.hasNext();) {
Hashtable ht = new Hashtable();
ht = (Hashtable) it.next();
strXML.append("<entry>");
strXML.append("<optionText>");
strXML.append("" + ht.get("id").toString() + "");
strXML.append("</optionText>");
strXML.append("<optionValue>");
strXML.append("" + ht.get("city_name").toString() + "");
strXML.append("</optionValue>");
strXML.append("</entry>");
}
strXML.append("</selectChoice>");
}
String xml = strXML.toString();
out.write(xml);
out.flush();
} catch (Exception e) {
e.printStackTrace();
}
out.close();
return null;
}
}
public class AreaLinkageDao {
/**
* 根据省ID查询城市信息
*
* @param parameter
* @param servletContext
* @return
*/
public List areaLinkage(String provinceId, ServletContext servletContext)
throws Exception {
RootDaoInterface rootDao = (RootDaoInterface) DataSourceHelper
.getDaoInterfae(servletContext);
String sql = "select id,city_code,city_name from tb_area_city where pid = ?";
return rootDao.preparedQuery(sql, new String[] { provinceId });
}
}