JSP页面中下拉框级联的实现
2012-11-16 20:48:45 来源:WEB开发网</SELECT></td>
</tr>
</table>
</td>
</tr>
</table>
JS的代码如下:
//JavaScript Document
var xmlHttp; //用于保存XMLHttpRequest对象的全局变量
//用于创建XMLHttpRequest对象
function createXmlHttp() {
//根据window.XMLHttpRequest对象是否存在使用不同的创建方式
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest(); //FireFox、Opera等浏览器支持的创建方式
} else {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");//IE浏览器支持的创建方式
}
}
function refreshEduLevelAndSpecialAjax() {
var grade = document.getElementById("grade").value;
refreshEduLevelAndSpecial(grade);
}
function refreshEduLevelAndSpecial(grade) {
createXmlHttp(); //创建XMLHttpRequest对象
xmlHttp.onreadystatechange = refreshEduLevelAndSpecialElement; //设置回调函数
xmlHttp.open("POST", "eduLevelAndSpecialByGradeNameInSpecialDetail",
true); //发送POST请求
xmlHttp.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
xmlHttp.send("grade=" + grade);
}
//处理服务器返回的信息 更新层次专业下拉框
function refreshEduLevelAndSpecialElement() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
//此处xmlHttp.responseText是请求的*Controller的某个方法返回的渲染页面的源代码
document.getElementById("refreshEduLevelAndSpecialAjax").innerHTML = xmlHttp.responseText;
}
}
}
function refreshSpecialAjax() {
var grade = document.getElementById("grade").value;
var eduLevelId = document.getElementById("eduLevelId").value;
refreshSpecial(grade, eduLevelId);
}
function refreshSpecial(grade, eduLevelId) {
createXmlHttp(); //创建XMLHttpRequest对象
xmlHttp.onreadystatechange = refreshSpecialElement; //设置回调函数
xmlHttp.open("POST", "specialByGradeNameAndEduLevelIdInSpecialDetail",
true); //发送POST请求
xmlHttp.setRequestHeader("Content-type",
"application/x-www-form-urlencoded");
xmlHttp.send("grade=" + grade + "&eduLevelId=" + eduLevelId);
}
//处理服务器返回的信息 更新专业下拉框
function refreshSpecialElement() {
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
//此处xmlHttp.responseText是请求的*Controller的某个方法返回的渲染页面的源代码
document.getElementById("refreshSpecialAjax").innerHTML = xmlHttp.responseText;
}
}
}
Controller代码:
@RequestMapping(value = "/eduLevelAndSpecialByGradeNameInSpecialDetail")
public ModelAndView getEduLevelAndSpecialByGradeNameInSpecialDetail(HttpServletRequest request,
HttpServletResponse response) throws JsonParseException, JsonMappingException, JSONException, IOException{
String gradeName=request.getParameter("grade");
更多精彩
赞助商链接