C# ASP Net Core 3.1 MVC中的级联下拉列表

我试图在ASP.NET Core 3.1中使用jQuery和Ajax创建一个级联下拉列表，但似乎无法找到解决方案

以下是我的模型类：

public class CountryStateViewModel
{
    public int CountryId { get; set; }
    public int StateId { get; set; }
}

public class Country
{
    public int CountryId { get; set; }
    public string CountryName { get; set; }
}

public class State
{
    public int CountryId { get; set; }
    public int StateId { get; set; }
    public string StateName { get; set; }
}

以下是我的控制器方法：

public ActionResult DropDown()
{
    List<Country> CountryList = new List<Country> { new Country { CountryId = 1, CountryName = "Sweden" }, new Country { CountryId = 2, CountryName = "Norway" } };
    ViewBag.CountryList = new SelectList(CountryList, "CountryId", "CountryName");
    return View();
}

public JsonResult GetStateList(int CountryId)
{
    List<State> StateList = new List<State> { new State { StateId=1,CountryId = 1, StateName = "Stockholm" }, new State { CountryId = 1, StateName = "Malmö", StateId=2 } };
    return Json(StateList);
}

我没能做到这一点。我想知道问题是否在于调用脚本？以下是我在Chrome开发者工具的控制台选项卡下看到的错误：

jquery.unobtrusive-ajax.min.js:1 Failed to load resource: the server responded with a status of 404 ()
jquery.min.js:1 Failed to load resource: the server responded with a status of 404 ()
jquery.min.js:1 Failed to load resource: the server responded with a status of 404 ()
jquery.unobtrusive-ajax.min.js:1 Failed to load resource: the server responded with a status of 404 ()

---

当我启动视图时，我可以看到两个下拉列表，但当我选择一个国家时，第二个下拉列表中不会显示任何国家（只有两个选项表示未定义）。

已解决！这需要一点反复，但我想我会分享我所做的，以防其他人遇到类似的问题。以下是我修改脚本的方式：

 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#CountryId").change(function () {
                $.get("GetStateList", { CountryId: $("#CountryId").val() }, function (data) {
                    $("#StateId").empty();
                    $.each(data, function (index, row) {
                        $("#StateId").append("<option value='" + row.StateId + "'>" + row.StateName + "</option>")
                    });
                });
            })
        });
    </script>

---

很抱歉我使用的是.NETCore3.1。如果你有~，会有什么不同吗<代码>$。获取（“~/Forum/GetStateList”，不幸的是，没有：/。不过谢谢你的建议。

jquery.unobtrusive-ajax.min.js:1 Failed to load resource: the server responded with a status of 404 ()
jquery.min.js:1 Failed to load resource: the server responded with a status of 404 ()
jquery.min.js:1 Failed to load resource: the server responded with a status of 404 ()
jquery.unobtrusive-ajax.min.js:1 Failed to load resource: the server responded with a status of 404 ()

 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#CountryId").change(function () {
                $.get("GetStateList", { CountryId: $("#CountryId").val() }, function (data) {
                    $("#StateId").empty();
                    $.each(data, function (index, row) {
                        $("#StateId").append("<option value='" + row.StateId + "'>" + row.StateName + "</option>")
                    });
                });
            })
        });
    </script>

public JsonResult GetStateList(int CountryId)
        {
            List<State> StateList = new List<State>();

            if (CountryId == 1)
            {
                StateList = new List<State> { new State { StateId = 1, CountryId = 1, StateName = "Stockholm" }, new State { CountryId = 1, StateName = "Malmö", StateId = 2 }, new State { CountryId = 1, StateId = 3, StateName = "Göteborg" } };
            }
             else
                StateList = new List<State> { new State { StateId = 1, CountryId = 1, StateName = "Oslo" }};

            return Json(StateList, new Newtonsoft.Json.JsonSerializerSettings());
    }

 new Newtonsoft.Json.JsonSerializerSettings()