我是AJAX的新手。我在JSP中有两个下拉列表,基于从第一个下拉列表中选择一个值的基础,我需要在后端的第二个下拉列表中填充值。我试图从 struct1.2中的 AJAX执行上述功能。
我在onChangePrdGrp [ JavaScript Function ]中使用了以下代码:
var prdGrp = document.getElementById('strProductGroup').value; if("" != prdGrp){ var xmlhttp; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } document.getElementById('prdPitch').style.display = "block"; document.forms[0].module.value= "getProductPicthed"; xmlhttp.open("POST","/lmsGetPrdPitched.do?prdGrp="+prdGrp,true); xmlhttp.send(); }else{ document.getElementById('prdPitch').style.display = "none"; document.getElementById('strProductPitched').value = ""; document.getElementById('strProduct').value = ""; }
DropDown1:
<tr> <td style="text-align: left" width="20%">Product Group</td> <td style="text-align: left" width="20%"><html:select property="strProductGroup" style="width:180px;" onchange="onChangePrdGrp()"> <html:option value="">select</html:option> <html:optionsCollection name="ProdGrpList" /> </html:select></td> </tr>
DropDown 2:[需要在此DropDown中填充值]
<tr id="prdPitch"> <td style="text-align: left" width="20%">Product Pitched</td> <td style="text-align: left" width="20%"><html:select property="strProductPitched" style="width:180px;"> <html:option value="">select</html:option> <%if(null != ProductPitchList) { %> <html:optionsCollection name="ProductPitchList" /> <%} %> </html:select></td> </tr>
请给我建议。
如果您使用jQuery,这非常简单
例如看这里
他们在这里给出了很好的例子。记住插入与jQuery相关的js文件
包括以下文件
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>