Ext的异步请求(二级级联动态加载下拉列表)

页面:

[html][/html] view plaincopyprint?

  1. <tr>
  2.             <td class=”label” width=”300″ >作业计划项模板</td>
  3.             <td>
  4.                 <select name=”modelId” size=”1″ style=”width: 6.8cm;” id=”s1″  subid=”s2″ onchange=”javascript:chooseFunction();”>
  5.                            <option value=””>请选择</option>
  6.                             <%for(int i=0;i<modellist.size();i++){
  7.                             TawwpModelVO tawwpModelVO = (TawwpModelVO)modellist.get(i);%>
  8.                             <option value='<%=tawwpModelVO.getId()%>’><%=tawwpModelVO.getModelName()%></option>
  9.                             <% }%>
  10.                  </select>
  11.             </td>
  12.         </tr>
  13.         <tr>
  14.             <td class=”label”  >
  15.             作业计划项名称
  16.             </td>
  17.             <td>
  18.                 <input id=”f1″ type=”hidden”  style=”width: 6.8cm;”>
  19.                 <select name=”functionId” size=”1″ style=”width: 6.8cm;” id=”s2″ >
  20.                 </select>
  21.              </td>
  22.         </tr>

 

前台页面的调用:

前台接收到 json 的处理

[html][/html] view plaincopyprint?

  1. Ext.Ajax.request({
  2.         method:’post’,
  3.                 url: ‘../assessmodel/functionContent.do?functionId=’+id,
  4.                 success: function(json){
  5.                       var aa = json.responseText;
  6.                       var data = eval(‘(‘+aa+’)’);
  7.                       var bb=data.rows;
  8.                       var sele = document.getElementById(“s2”);
  9.                       sele.innerHTML = “”;
  10.                       var option2 = document.createElement(‘option’);
  11.                         option2.value =””;
  12.                         option2.text= “请选择”;
  13.                         option2.selected=”selected”;
  14.                         sele.add(option2);
  15.                       for(var i=0;i<bb.length;i++){
  16.                         var option = document.createElement(‘option’);
  17.                         option.value = bb[i].id;
  18.                         option.text= bb[i].name;
  19.                         sele.add(option);
  20.                       }
  21.                 },
  22.                failure : function() {
  23.                       alert(“加载数据异常”);
  24.               }
  25.            });

后台的处理:

[html][/html] view plaincopyprint?

  1. private ActionForward findFunction(ActionMapping mapping, ActionForm form,
  2.             HttpServletRequest request, HttpServletResponse response) {
  3.         IAssessModelMgr assessModelMgr = (IAssessModelMgr) getBean(“assessModelMgr”);
  4.         String id = request.getParameter(“functionId”);
  5.         List assList =null;
  6.         List nList = new ArrayList();
  7.         try {
  8.             assList = assessModelMgr.findFunctionList(id);
  9.             //request.setAttribute(“functionList”,assList);
  10.             for(int i=0;i<assList.size();i++){
  11.                 Map map = new HashMap();
  12.                 TawwpModelContentVO  fu = new  TawwpModelContentVO();
  13.                 fu=(TawwpModelContentVO)assList.get(i);
  14.                 map.put(“id”, fu.getContendid());
  15.                 map.put(“name”,fu.getName());
  16.                 nList.add(map);
  17.             }
  18.             response.setContentType(“text/xml;charset=UTF-8”);
  19.             // 返回JSON对象
  20.             response.getWriter().print(JSONUtil.list2JSON(nList));
  21.             return null;
  22.         } catch (Exception e) {
  23.             //generalError(request, e);
  24.             ActionMessages messages = new ActionMessages();
  25.             messages.add(ActionMessages.GLOBAL_MESSAGE, new ActionMessage(
  26.                     “submit.title.failure”));
  27.             saveMessages(request, messages);
  28.             return mapping.findForward(“failure”);
  29.         }
  30.     }

标签