MVC ajax 下拉列表 url 更改

本文关键字:更改 url 下拉列表 ajax MVC | 更新日期: 2023-09-27 18:36:32

我是ajax的新手,我需要帮助。这是一个脚本,一旦选择了第一个下拉列表,就会填充第二个下拉列表。它使用从数据库获取数据的 GetStates 操作可以正常工作。

<script type="text/javascript">
$(document).ready(function () {
    $("#CountriyID").change(function () {
        var abbr = $("#CountriyID").val();
        $.ajax({
            url: "/SetUp/GetStates",
            data: { countryCode: abbr },
            dataType: "json",
            type: "POST",
            error: function () {
                alert("An error occurred.");
            },
            success: function (data) {
                var items = "";
                $.each(data, function (i, item) {
                    items += "<option value='"" + item.Value + "'">" + item.Text + "</option>";
                });
                $("#StateID").html(items);
            }
        });
    });
});
</script>

这是我正在研究的观点

@using (Html.BeginForm("Index", "SetUp", FormMethod.Post))
{
    <form action="" method="post">
        <input type="submit" name="action:AddCity" value="Add" />
    </form>
    <div class="editor-field">@Html.DropDownListFor(model => model.CountriyID, new SelectList(Model.Countries, "ID", "Text"))</div>
     <div class="editor-field">@Html.DropDownListFor(model => model.StateID, new SelectList(Model.States, "ID", "Text"))</div>
}

如果我需要添加城市,请单击提交按钮,它会转到正确的操作。当我填充下拉列表时出现问题。人口后,"城市"按钮不再响应。 看起来"/SetUp/GetStates"的url get堆栈,我无法再对我的表单执行任何操作。

请让我知道我做错了什么,在哪里看看?提前谢谢。

MVC ajax 下拉列表 url 更改

请尝试以下代码,希望对您有所帮助:

<form action="" method="post">
    <div class="editor-field">@Html.DropDownListFor(model => model.CountriyID, new SelectList(Model.Countries, "ID", "Text"))</div>
     <div class="editor-field">@Html.DropDownListFor(model => model.StateID, new SelectList(Model.States, "ID", "Text"))</div>
<input type="submit" name="action:AddCity" value="Add" />
    </form>

由于下拉列表必须进入标签,并且理想情况下提交必须在标签中的最后位置。