html
<html>
<head>
<title>Title</title>
<script src="js/jquery.min.js"></script>
<style type="text/css">
select{
width: 100px;
height: 30px;
line-height: 30px;
}
</style>
<script language="JavaScript">
$(function(){
//生成第一個下拉框
setSheng();
//生成市
setShi();
//生成區
setQu();
});
function setSheng(){
$.ajax({
url:"DiquServlet",
method:"post",
dataType:"json",
data:{"method":"getSheng"},
success:function (data) {
console.log(data);
var html = "";
if(data!=null){
for(var d in data){
html+='<option value="'+data[d].id+'">'+data[d].dname+'</option>';
}
}
$("#sheng").append(html);
}
});
}
function setShi(){
$("#sheng").change(function(){
//先獲取改變的省的ID
var sheng = $(this).val();
var obj = {"shengid":sheng,"method":"getShiBySheng"};
$.ajax({
url:"DiquServlet",
method:"post",
data:obj,
dataType:"json",
success:function (data) {
console.log(data);
var html = "<option value=\"0\">---請選擇---</option>";
$("#qu").html(html);
if(data!=null){
for(var d in data){
html+='<option value="'+data[d].id+'">'+data[d].dname+'</option>';
}
}
$("#shi").html(html);
}
});
});
}
function setQu(){
$("#shi").change(function(){
//先獲取改變的省的ID
var sheng = $(this).val();
var obj = {"shengid":sheng,"method":"getShiBySheng"};
$.ajax({
url:"DiquServlet",
method:"post",
data:obj,
dataType:"json",
success:function (data) {
console.log(data);
var html = "<option value=\"0\">---請選擇---</option>";
if(data!=null){
for(var d in data){
html+='<option value="'+data[d].id+'">'+data[d].dname+'</option>';
}
}
$("#qu").html(html);
}
});
});
}
</script>
</head>
<body>
<select id="sheng">
<option value="0">---請選擇---</option>
</select>
<select id="shi">
<option value="0">---請選擇---</option>
</select>
<select id="qu">
<option value="0">---請選擇---</option>
</select>
</body>
</html>
servlet
@WebServlet(name = "DiquServlet",urlPatterns = "/DiquServlet")
public class DiquServlet extends HttpServlet {
private IDiquService service = new DiquServiceImpl();
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
String method = request.getParameter("method");
switch (method){
case "getSheng":
getSheng(response);
break;
case "getShiBySheng":
getShiBySheng(request,response);
break;
}
}
private void getShiBySheng(HttpServletRequest request,HttpServletResponse response) throws IOException {
String shengid = request.getParameter("shengid");
String shis = "";
if(shengid!=null && !shengid.equals("0")){
List<Diqu> shiList = service.findDiquByParentId(Integer.parseInt(shengid));
shis = JsonUtil.getJsonString4JavaList(shiList);
}
response.getWriter().print(shis);
}
private void getSheng(HttpServletResponse response) throws IOException {
List<Diqu> sheng = service.findSheng();
String s = JsonUtil.getJsonString4JavaList(sheng);
response.getWriter().print(s);
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request,response);
}
}
