Java province and city cascading drop-down menu example code-javaTutorial-php.cn

Java province and city cascading drop-down menu example code

高洛峰

Release： 2017-01-17 11:28:42

Original

1819 people have browsed it

The example in this article shares the specific code of java province and city cascade for your reference. The specific content is as follows

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());
    }  
  }
    
  
}

Copy after login

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: &#39;id&#39;, //1
         textField: &#39;provinceName&#39;, // 湖北省              
         editable: false,
        // data:dataCombobox //指定下拉列表的数据源
        url:&#39;../LoadAreaServlet&#39;,
        method:&#39;post&#39;,
        onLoadSuccess:function(data){
            
          var provId = $("#province").combobox("getValue");
            
          loadCity(provId);
        },
        onSelect:function(recode){
          loadCity(recode.id);
        }
          
       });
     });
  
     function loadCity(provId){
       $("#city").combobox({
         width: 150,
         valueField: &#39;id&#39;, //1
         textField: &#39;cityName&#39;, // 湖北省              
         editable: false,
        // data:dataCombobox //指定下拉列表的数据源
        url:&#39;../LoadAreaServlet?provinceID=&#39;+provId,
        method:&#39;post&#39;
       });
     }
   
 </script>
 </head>
   
 <body> 
  省：
  <select id="province" >
     <option value="0">数据加载中..</option>
         
  </select>
  <br/>
    
  市：
  <select id="city" >
     <option value="">数据加载中..</option>
  </select>
   
   
 </body>
</html>

Copy after login

The above is the entire content of this article, I hope it will be helpful to everyone learning java programming.

For more articles related to java provincial and municipal cascading drop-down menu example codes, please pay attention to the PHP Chinese website!