Spring MVC中JQuery/Ajax调用Controller动态下拉框失败排查

我帮你排查了代码里的几个关键问题，这些应该就是导致/districts接口没触发的核心原因：

1. 请求参数名称不匹配 #

前端Ajax请求里传的参数是stateName，但你的Controller方法里用@RequestParam(value = "statesId", required = true)接收，参数名完全不一致，Spring无法完成参数绑定，所以方法根本不会执行。

修改Controller：把参数名改成和前端一致的stateName（也可以改前端参数名，推荐改Controller更直观）：

@RequestMapping(value = "/districts", method = RequestMethod.GET)
public @ResponseBody List<String> districtList(@RequestParam(value = "stateName", required = true) String state) {
    System.out.println("In district list");
    List<District> district=service.getDisticts(state);
    List<String> newDistrict=new ArrayList<String>();
    for (District dist: district) {
        System.out.println(dist.toString());
        newDistrict.add(dist.toString());
    }
    Collections.sort(newDistrict);
    // 这里不需要Model，因为@ResponseBody是直接把数据返回给前端，不需要往视图模型里存
    return newDistrict;
}

2. 前端处理返回数据的逻辑错误 #

你的Controller返回的是List<String>，但前端JS里用data[i].name去访问属性，这会直接报错——因为每个元素是纯字符串，不是带name属性的对象。

修改前端JS：直接使用data[i]即可：

$(document).ready(function() {
    $('#states').change( function() {
        $.getJSON('${findStateCitiesURL}', { 
            stateName : $(this).val(), 
            ajax : 'true' 
        }, function(data) {
            var html = '<option value="">Select District</option>';
            var len = data.length;
            for ( var i = 0; i < len; i++) {
                // 直接用data[i]，因为返回的是字符串列表
                html += '<option value="' + data[i] + '">' + data[i] + '</option>';
            }
            $('#district').html(html);
        });
    });
});

3. 重复引入jQuery导致冲突 #

你的页面里引入了两个不同的jQuery文件：

• /assets/js/jquery-1.10.2.min.js
• /resources/jquery.js

多个jQuery版本会导致事件绑定失效、Ajax无法正常工作等问题，删除其中一个，推荐保留版本明确的jquery-1.10.2.min.js。

4. 确保District下拉框的ID正确 #

检查你的District下拉框是否有id="district"，从你给出的代码片段看这里被截断了，要确保完整：

<form:select path="district.name" class="form-control selectpicker" id="district" title="Select District">
    <form:option value="" />
</form:select>

做完这些修改后，应该就能正常触发Controller的districtList方法，实现动态下拉框的联动功能了。

内容的提问来源于stack exchange，提问作者Danzen_mstr