java省市级联下拉菜单实例代码

前端技术 2023/09/01 Java

本文实例为大家分享了java省市级联的具体代码，供大家参考，具体内容如下

1.LoadAreaServlet.java

package com.scce.servlet;
 
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
 
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
import net.sf.json.JSONArray;
 
import com.scce.pojo.City;
import com.scce.pojo.Prov;
 
public class LoadAreaServlet extends HttpServlet {
 
   
   
  private static final long serialVersionUID = 1L;
 
  public void doGet(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
      this.doPost(request, response);
  }
 
   
  public void doPost(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
    response.setContentType(\"text/html;charset=utf-8\");
    request.setCharacterEncoding(\"utf-8\");
    PrintWriter out = response.getWriter();
    ArrayList<Prov> provs = new ArrayList<Prov>();
    String provinceID = request.getParameter(\"provinceID\");
    if (provinceID==\"\" || provinceID==null) {
      System.out.println(\"加载地级市信息\");
    Prov pro1 = new Prov();
    pro1.setId(0);
    pro1.setProvinceName(\"湖北\");
    Prov pro2 = new Prov();
    pro2.setId(1);
    pro2.setProvinceName(\"湖南\");
    Prov pro3 = new Prov();
    pro3.setId(2);
    pro3.setProvinceName(\"广东\");
    Prov pro4 = new Prov();
    pro4.setId(3);
    pro4.setProvinceName(\"广西\");
    provs.add(pro1);
    provs.add(pro2);
    provs.add(pro3);
    provs.add(pro4);
    System.out.println(JSONArray.fromObject(provs).toString()); //[{\"id\":0,\"provinceName\":\"湖北\"},{}]
    out.print(JSONArray.fromObject(provs).toString());
    }else{
      ArrayList<City> citys = new ArrayList<City>();
      if (provinceID.equals(\"0\")) {
        City city1 = new City();
        city1.setId(0);
        city1.setCityName(\"武汉市\");
        City city2 = new City();
        city2.setId(1);
        city2.setCityName(\"黄石市\");
        City city3 = new City();
        city3.setId(2);
        city3.setCityName(\"十堰市\");
        citys.add(city1);
        citys.add(city2);
        citys.add(city3);
      }
      if (provinceID.equals(\"1\")) {
        City city1 = new City();
        city1.setId(0);
        city1.setCityName(\"长沙市\");
        City city2 = new City();
        city2.setId(1);
        city2.setCityName(\"岳阳市\");
        City city3 = new City();
        city3.setId(2);
        city3.setCityName(\"湘潭市\");
        citys.add(city1);
        citys.add(city2);
        citys.add(city3);
      }
      System.out.println(JSONArray.fromObject(citys).toString());
      out.print(JSONArray.fromObject(citys).toString());
    }  
  }
   
 
}

2.test1.html

<!DOCTYPE html>
<html>
 <head>
  <title>chapter4-test1</title>
   
  <meta http-equiv=\"keywords\" content=\"keyword1,keyword2,keyword3\">
  <meta http-equiv=\"description\" content=\"this is my page\">
  <meta http-equiv=\"content-type\" content=\"text/html; charset=UTF-8\">
   
  
 
 <link rel=\"stylesheet\" href=\"../UI/themes/icon.css\" type=\"text/css\"></link>
  
 <link rel=\"stylesheet\" href=\"../UI/themes/default/easyui.css\" type=\"text/css\"></link>
  
 <!-- <script type=\"text/javascript\" src=\"../js/jquery-1.8.2.min.js\"></script> -->
 <script type=\"text/javascript\" src=\"../UI/jquery.min.js\"></script>
 <script type=\"text/javascript\" src=\"../UI/jquery.easyui.min.js\"></script>
  
 <script type=\"text/javascript\" src=\"../UI/locale/easyui-lang-zh_CN.js\"></script>
 <script type=\"text/javascript\">
 //LoadAreaServlet
  /* var dataCombobox=[{\"id\":1,\"provinceName\":\"湖北省\"}, 
    {\"id\":2,\"provinceName\":\"湖南省\",\"selected\":true},
    {\"id\":3,\"provinceName\":\"河北省\"},
    {\"id\":4,\"provinceName\":\"河南省\"}
  ]; */
 $(function () {
       $(\"#province\").combobox({
         width: 150,
         valueField: \'id\', //1
         textField: \'provinceName\', // 湖北省              
         editable: false,
        // data:dataCombobox //指定下拉列表的数据源
        url:\'../LoadAreaServlet\',
        method:\'post\',
        onLoadSuccess:function(data){
           
          var provId = $(\"#province\").combobox(\"getValue\");
           
          loadCity(provId);
        },
        onSelect:function(recode){
          loadCity(recode.id);
        }
         
       });
     });
 
     function loadCity(provId){
       $(\"#city\").combobox({
         width: 150,
         valueField: \'id\', //1
         textField: \'cityName\', // 湖北省              
         editable: false,
        // data:dataCombobox //指定下拉列表的数据源
        url:\'../LoadAreaServlet?provinceID=\'+provId,
        method:\'post\'
       });
     }
  
 </script>
 </head>
  
 <body> 
  省：
  <select id=\"province\" >
     <option value=\"0\">数据加载中..</option>
        
  </select>
  <br/>
   
  市：
  <select id=\"city\" >
     <option value=\"\">数据加载中..</option>
  </select>
  
  
 </body>
</html>

以上就是本文的全部内容，希望对大家学习java程序设计有所帮助。

本文地址：https://www.stayed.cn/item/2485

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案