Struts2 、Jquery 、ajax实现二级下拉框联动
一般我们对于固定值联动的下拉框可能会直接把固定值放在数组中,在选择一级下拉框时触发onchange事件,对二级下拉框中赋值。然而在很多情况下我们需要在选择一级下拉框后从数据库动态取出值赋给二级下拉框,这时我们就需要借助ajax无页面刷新的优势来实现。
首先我们来看jsp页面
<tr><td><font color="red">*</font>一级下拉框:</td><td><html:select property="systemkey" onchange="changeValue()"><html:options collection="systemkeyMap" property="label"labelProperty="value" /></html:select></td></tr><tr><td><font color="red">*</font>二级下拉框:</td><td><html:select property="reportkey" ><html:options collection="reportkeyMap" property="label"labelProperty="value" /></html:select></td></tr>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html"%>struts_html标签,可以根据自己的情况采用各种标签,这里就以它作为例子onchange时调用changeValue()方法如下
var jq=jQuery.noConflict();function changeValue(){var selectValue=document.forms[0].systemkey.value; jq.ajax({type:"POST",url:"t09_report_analy_ajax.do",data:"systemkey="+selectValue, // 传入的参数timeout: 10000, // dataType:"json",success:function(data){ setValue(data); } });}function setValue(data){document.forms[0].reportkey.options.length=0;var spl=data.split(",");document.forms[0].reportkey.options[0]=new Option('请选择','请选择');for(var i=1;i<spl.length;i++){document.forms[0].reportkey.options[i]=new Option(spl[i-1],spl[i-1]);}}
<action path="/t09_report_analy/t09_report_analy_ajax" parameter="analy_ajax" name="reportActionForm" type="com.ist.poc.rpp.controller.Report_analyAction" validate="false" scope="request"> </action>
path="/t09_report_analy/t09_report_analy_ajax"所以一般我们在页面跳转时会写"/t09_report_analy/t09_report_analy_ajax.do" 但如果这样写的话是找不到对应得action的,必须将url写到最后的包它会直接定位到要跳转的action中。
public ActionForward t09_report_analy_ajax(ActionMapping mapping,ActionForm actionform,HttpServletRequest request,HttpServletResponse response)throws Exception{response.setContentType("text/html");response.setCharacterEncoding("GBK");//根据参数从数据库得到二级菜单数据Report_analyDAO report_analyDAO=(Report_analyDAO)context.getBean("report_analyDAO"); String systemkeyStr=request.getParameter("systemkey"); //得到前台传来的参数 ArrayList<Report> reportList=(ArrayList)Report_analyDAO.getReportKeyBySys(sqlMap, systemkeyStr); String context=""; for(Report report:reportList){context+=report.getReportname()+","; }PrintWriter out=response.getWriter();out.print(context);out.close();return null;}