Question

我正在使用spring MVC框架。我在jsp页面中有两个下拉列表第二个下拉列表完全取决于第一个下拉列表，但问题是在第一个和第二个下拉列表中选择项目后，整个页面被刷新。

我无法在ajax调用后停止刷新页面。这是我的JavaScript代码（ajax调用）：

    
function loadDoc() {
        var xhttp;
        if (window.XMLHttpRequest) {
        // code for modern browsers
            xhttp = new XMLHttpRequest();
        } else {
        // code for IE6, IE5
            xhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xhttp.onreadystatechange = function() {
             if (xhttp.readyState == 4 && xhttp.status == 200) {
                  document.getElementById("demo").innerHTML = xhttp.responseText;
             }
        };
        xhttp.open("GET", "UserAccess.do", true);
        xhttp.send();
}

这是我的jsp页面代码：

 <form:form action="UserAccess.do" commandName="u" method="POST">
<table id="demo">
<tr>
<td >Select City</td>
<form:select class="form-control" path="city_id"      onchange="display();loadDoc();">
<form:option value="0">Select</form:option>
<c:forEach var="u" items="${Showcity}">
<form:option value="${u.getCity_id()}">${u.getCity_name()}</form:option>
</c:forEach>
</form:select>
</td>
<td >Select Area</td>
<form:select class="form-control" path="area_id" onchange="display();loadDoc();">
<form:option value="0">Select</form:option>
<c:forEach var="u" items="${ShowArea}">
<form:option value="${u.getArea_id()}">${u.getArea_name()}</form:option>
</c:forEach>
</form:select>
</td>
</tr>
</table>

下拉列表使用控制器从数据库中获取数据这是我的Controller页面代码：

 @RequestMapping(value="UserAccess.do",method=RequestMethod.GET)
  List<Userfield>Showcity=getUserservice().Showcity();
  map.addAttribute("Showcity",Showcity);
 List<Userfield>ShowArea=getUserservice().ShowArea(Integer.parseInt(id));
 map.addAttribute("ShowArea",ShowArea);

Answer 1

尝试在return false;中使用loadDoc()

function loadDoc() {
    ....
    ....
    xhttp.send();
    return false;
}

如何在选择下拉列表

1 个答案: