如何解决不工作的级联下拉

How to resolve a not working cascading drop down

我有一个级联下拉菜单,例如第一个下拉菜单显示国家/地区列表,然后根据对国家/地区的选择填充下一个下拉菜单。问题是在开发环境中它工作正常但是当部署在服务器中时第一个下拉列表被正确填充因为它的元素来自资源文件并且在选择第一个下拉列表之后我得到一个错误。

JS :

<script>
    $(document).ready(function () {

        $("#Site").change(function () {
            var SelectedVal = $(this).val();
            $("#Model").html('');
            $("#Model").append($("<option></option>").attr("value", '')
                .text(' '));
            if (SelectedVal != '') {

                $.get("/Home/GetModelList", { Sid: $("#Site").val() }, function (data) {
                    $("#Model").empty();
                    $("#Model").html('');
                    $("#Model").append($("<option></option>").attr("value", '')
                        .text('  '));
                    if (data.modelAlert != null) {
                        alert(data.projectAlert);
                    }
                    $.each(data.models, function (index, item) {
                        $("#Model").append($('<option></option>').text(item));
                    });
                });
            }
        })
    });
</script>

控制器:

public JsonResult GetModelList()
{
        List<string> models = db.GetModels();
        string modelAlert = alert.GetAlert();
        var result = new { modelAlert, models };
        return Json(result, JsonRequestBehavior.AllowGet);
}

我得到的错误信息是

Failed to load resource: the server responded with a status of 404 (Not Found) Home/GetModelList?Sid=Ind:1

我检查了类似this的问题,都是关于JS路径或控制器路径,但我已经给出了绝对路径。有人可以让我知道我哪里出错了,如果需要任何其他数据,请告诉我。

谢谢

$.get("/Home/GetModelList", { Sid: $("#Site").val() }, function (data) {

上面一行是导致路由问题的原因,通常当我们以这种方式从js调用控制器动作时,由于文件夹结构引用,往往会出现路由问题。为了避免这个路由问题并且更清楚,我们还可以像下面这样从js调用控制器动作

$.get('@Url.Action("MethodName", "ControllerName")', function (data) {

这解决了我的问题。