使用Ajax和彈簧mvc的相關選擇框

我有2個下拉菜單（第二個框選項取決於當前選中的第一個框選項）的問題。我現在擁有的是： 控制器：使用Ajax和彈簧mvc的相關選擇框

@Controller 
@RequestMapping(ADMINISTRATION) 
{...} 
    @RequestMapping(value = USERS + STUDENT + "/reloadGroups/{schoolId}", method = GET) 
    public @ResponseBody 
    List<StudyGroup> reloadGroups(@PathVariable(value = "schoolId") final int schoolId) { 
     return studyGroupService.getStudyGroupBySchool(schoolService.getSchool(schoolId)); 
    }

HTML：

<script type="text/javascript"> 
       $(document).ready(
        function() { 
         var selectSchool = $("#school"); 
         var selectGroup = $("#studyGroup"); 

         selectSchool.change(function() { 
          var schoolId = $("#school option:selected").val(); 

          $.get("/administration/users/student/reloadGroups/" 
            + schoolId, function(data) { 
           selectGroup.empty(); 
           console.log(data); 
           var group = JSON.parse(data); 
           for (var option in data) { 
            selectGroup.append($("<option/>", { 
             text : group[option].name, 
             key : group[option].id 
            })); 
           } 
          }) 

         }) 
        }); 
</script> 
    //and of course 2 select boxes with ids 'school' and 'studyGroup'

我得到這樣的錯誤：

"NetworkError: 404 Not Found - http://localhost:8080/administration/users/student/reloadGroups/2"

，但我不知道是什麼原因，請求映射應該沒問題。當我在瀏覽器例如，鍵入http://localhost:8080/drdiet-web/administration/users/student/reloadGroups/1誤差變化到500：

"NetworkError: 500 Internal Server Error - http://localhost:8080/drdiet-web/administration/users/student/reloadGroups/1"

出了什麼問題？我對Ajax完全陌生。

編輯

這「工作」過，但不完全是，因爲我只能一次改變第一個下拉列表值，因此影響了第二個選項：

$(document).ready(function() { 
     var selectSchool = $("#school"); 
     var selectGroup = $("#studyGroup"); 


     selectSchool.change(function(){ 
       var schoolId = $("#school option:selected").val(); 

      $.ajax({ 
      url: config.baseUrl + '/administration/users/student/reloadGroups/' + schoolId, 
      type: 'GET', 
      data: schoolId, 
      contentType: "application/x-www-form-urlencoded; charset=UTF-8", 
      dataType: 'text', 
      error : function() { 
       alert("error"); 
       console.log("error"); 
      }, 
      success: function(data){ 
       selectGroup.empty(); 
       var aaa = JSON.parse(data); 
       console.log(data); 
       alert("ok"); 
       for(var opt in aaa){ 
        selectGroup.append($("<option/>", { 
         text: aaa[opt].name, 
         key: aaa[opt].id 
        })); 
       console.log(aaa[opt]); 
       } 
      } 
      }) 
     }); 
    });

來源

2013-03-06 Iwo Kucharski

我也嘗試過使用$ .ajax（）方法，但它不起作用 – 2013-03-06 14:03:30

如果您直接訪問控制器的URL時發生500內部服務器錯誤，那麼我首先查看您的服務器日誌以查看是否拋出異常並首先解決此問題。 – Jer 2013-03-07 09:06:28

在/ usr/share/tomcat7/logs中，只有像[[07/Mar/2013：10：09：24 +0100]]的行「GET/administration /用戶/學生/ reloadGroups/3 HTTP/1.1「200 12」，並在/ usr/share/tomcat7/log文件中爲空。 – 2013-03-07 09:18:55

好吧，錯誤404很明顯（config.baseUrl）。內部服務器錯誤（代碼500）是由控制器中不同類型的列表引起的。我只是沒有發現它，感謝所有答覆。

來源

2013-03-07 10:07:27

使用Ajax和彈簧mvc的相關選擇框

回答

相關問題