`
wangtong40
  • 浏览: 248698 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

AJAX基础教程－6 Dynamic List

AjaxAIRServletJavaScriptMicrosoft 
阅读更多
js 代码
  1. <script type=< span="">"text/javascript">   
  2.     var xmlHttp;   
  3.     function createXMLHttpRequest() {   
  4.         if (window.ActiveXObject) {   
  5.         xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");   
  6.         }   
  7.         else if (window.XMLHttpRequest) {   
  8.         xmlHttp = new XMLHttpRequest();   
  9.         }   
  10.     }   
  11.        
  12.     function refreshModelList() {   
  13.         var make = document.getElementById("make").value;   
  14.         var modelYear = document.getElementById("modelYear").value;   
  15.         if(make == "" || modelYear == "") {   
  16.             clearModelsList();   
  17.             return;   
  18.         }   
  19.         var url = "RefreshModelList?"  
  20.         + createQueryString(make, modelYear) + "&ts=" + new Date().getTime();   
  21.         createXMLHttpRequest();   
  22.         xmlHttp.onreadystatechange = handleStateChange;   
  23.         xmlHttp.open("GET", url, true);   
  24.         xmlHttp.send(null);   
  25.     }   
  26.        
  27.     function createQueryString(make, modelYear) {   
  28.     var queryString = "make=" + make + "&modelYear=" + modelYear;   
  29.     return queryString;   
  30.     }   
  31.   
  32.     function handleStateChange() {   
  33.         if(xmlHttp.readyState == 4) {   
  34.             if(xmlHttp.status == 200) {   
  35.             updateModelsList();   
  36.             }   
  37.         }   
  38.     }   
  39.     function updateModelsList() {   
  40.         clearModelsList();   
  41.         var models = document.getElementById("models");   
  42.         var results = xmlHttp.responseXML.getElementsByTagName("model");   
  43.         var option = null;   
  44.         for(var i = 0; i < results.length; i++) {   
  45.             option = document.createElement("option");   
  46.             option.appendChild   
  47.             (document.createTextNode(results[i].firstChild.nodeValue));   
  48.             models.appendChild(option);   
  49.         }   
  50.     }   
  51.        
  52.     function clearModelsList() {   
  53.         var models = document.getElementById("models");   
  54.         while(models.childNodes.length > 0) {   
  55.         models.removeChild(models.childNodes[0]);   
  56.         }   
  57.     }   
  58. </script>  
java 代码
  1. package ajax.foundations_of_ajax;   
  2.   
  3. import java.io.IOException;   
  4. import java.util.ArrayList;   
  5. import java.util.Iterator;   
  6. import java.util.List;   
  7.   
  8. import javax.servlet.ServletException;   
  9. import javax.servlet.http.HttpServlet;   
  10. import javax.servlet.http.HttpServletRequest;   
  11. import javax.servlet.http.HttpServletResponse;   
  12.   
  13. public class RefreshModelListServlet extends HttpServlet {   
  14.     private static List availableModels = new ArrayList();   
  15.   
  16.     protected void processRequest(HttpServletRequest request,   
  17.             HttpServletResponse response) throws ServletException, IOException {   
  18.         response.setContentType("text/html;charset=UTF-8");   
  19.         int modelYear = Integer.parseInt(request.getParameter("modelYear"));   
  20.         String make = request.getParameter("make");   
  21.         StringBuffer results = new StringBuffer("<models></models>");   
  22.         MakeModelYear availableModel = null;   
  23.         for (Iterator it = availableModels.iterator(); it.hasNext();) {   
  24.             availableModel = (MakeModelYear) it.next();   
  25.             if (availableModel.modelYear == modelYear) {   
  26.                 if (availableModel.make.equals(make)) {   
  27.                     results.append("<model></model>");   
  28.                     results.append(availableModel.model);   
  29.                     results.append("");   
  30.                 }   
  31.             }   
  32.         }   
  33.         results.append("");   
  34.         response.setContentType("text/xml");   
  35.         response.getWriter().write(results.toString());   
  36.     }   
  37.   
  38.     protected void doGet(HttpServletRequest request,   
  39.             HttpServletResponse response) throws ServletException, IOException {   
  40.         processRequest(request, response);   
  41.     }   
  42.   
  43.     public void init() throws ServletException {   
  44.         System.out.println("ddd");   
  45.         availableModels.add(new MakeModelYear(2006, "Dodge", "Charger"));   
  46.         availableModels.add(new MakeModelYear(2006, "Dodge", "Magnum"));   
  47.         availableModels.add(new MakeModelYear(2006, "Dodge", "Ram"));   
  48.         availableModels.add(new MakeModelYear(2006, "Dodge", "Viper"));   
  49.         availableModels.add(new MakeModelYear(1995, "Dodge", "Avenger"));   
  50.         availableModels.add(new MakeModelYear(1995, "Dodge", "Intrepid"));   
  51.         availableModels.add(new MakeModelYear(1995, "Dodge", "Neon"));   
  52.         availableModels.add(new MakeModelYear(1995, "Dodge", "Spirit"));   
  53.         availableModels.add(new MakeModelYear(1985, "Dodge", "Aries"));   
  54.         availableModels.add(new MakeModelYear(1985, "Dodge", "Daytona"));   
  55.         availableModels.add(new MakeModelYear(1985, "Dodge", "Diplomat"));   
  56.         availableModels.add(new MakeModelYear(1985, "Dodge", "Omni"));   
  57.         availableModels.add(new MakeModelYear(1970, "Dodge", "Challenger"));   
  58.         availableModels.add(new MakeModelYear(1970, "Dodge", "Charger"));   
  59.         availableModels.add(new MakeModelYear(1970, "Dodge", "Coronet"));   
  60.         availableModels.add(new MakeModelYear(1970, "Dodge", "Dart"));   
  61.         availableModels.add(new MakeModelYear(2006, "Chevrolet", "Colorado"));   
  62.         availableModels.add(new MakeModelYear(2006, "Chevrolet", "Corvette"));   
  63.         availableModels.add(new MakeModelYear(2006, "Chevrolet", "Equinox"));   
  64.         availableModels   
  65.                 .add(new MakeModelYear(2006, "Chevrolet", "Monte Carlo"));   
  66.         availableModels.add(new MakeModelYear(1995, "Chevrolet", "Beretta"));   
  67.         availableModels.add(new MakeModelYear(1995, "Chevrolet", "Camaro"));   
  68.         availableModels.add(new MakeModelYear(1995, "Chevrolet", "Cavalier"));   
  69.         availableModels.add(new MakeModelYear(1995, "Chevrolet", "Lumina"));   
  70.         availableModels.add(new MakeModelYear(1985, "Chevrolet", "Cavalier"));   
  71.         availableModels.add(new MakeModelYear(1985, "Chevrolet", "Chevette"));   
  72.         availableModels.add(new MakeModelYear(1985, "Chevrolet", "Celebrity"));   
  73.         availableModels   
  74.                 .add(new MakeModelYear(1985, "Chevrolet", "Citation II"));   
  75.         availableModels.add(new MakeModelYear(1970, "Chevrolet", "Bel Air"));   
  76.         availableModels.add(new MakeModelYear(1970, "Chevrolet", "Caprice"));   
  77.         availableModels.add(new MakeModelYear(1970, "Chevrolet", "Chevelle"));   
  78.         availableModels   
  79.                 .add(new MakeModelYear(1970, "Chevrolet", "Monte Carlo"));   
  80.         availableModels.add(new MakeModelYear(2006, "Pontiac", "G6"));   
  81.         availableModels.add(new MakeModelYear(2006, "Pontiac", "Grand Prix"));   
  82.         availableModels.add(new MakeModelYear(2006, "Pontiac", "Solstice"));   
  83.         availableModels.add(new MakeModelYear(2006, "Pontiac", "Vibe"));   
  84.         availableModels.add(new MakeModelYear(1995, "Pontiac", "Bonneville"));   
  85.         availableModels.add(new MakeModelYear(1995, "Pontiac", "Grand Am"));   
  86.         availableModels.add(new MakeModelYear(1995, "Pontiac", "Grand Prix"));   
  87.         availableModels.add(new MakeModelYear(1995, "Pontiac", "Firebird"));   
  88.         availableModels.add(new MakeModelYear(1985, "Pontiac", "6000"));   
  89.         availableModels.add(new MakeModelYear(1985, "Pontiac", "Fiero"));   
  90.         availableModels.add(new MakeModelYear(1985, "Pontiac", "Grand Prix"));   
  91.         availableModels.add(new MakeModelYear(1985, "Pontiac", "Parisienne"));   
  92.         availableModels.add(new MakeModelYear(1970, "Pontiac", "Catalina"));   
  93.         availableModels.add(new MakeModelYear(1970, "Pontiac", "GTO"));   
  94.         availableModels.add(new MakeModelYear(1970, "Pontiac", "LeMans"));   
  95.         availableModels.add(new MakeModelYear(1970, "Pontiac", "Tempest"));   
  96.     }   
  97.   
  98.     private static class MakeModelYear {   
  99.         private int modelYear;   
  100.   
  101.         private String make;   
  102.   
  103.         private String model;   
  104.   
  105.         public MakeModelYear(int modelYear, String make, String model) {   
  106.             this.modelYear = modelYear;   
  107.             this.make = make;   
  108.             this.model = model;   
  109.         }   
  110.     }   
  111. }   
分享到：
| AJAX基础教程－5 Ajax Validate
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics