c# - 如何使用动态 javascript 下拉列表进行 MVC 编辑

Question

当我进行 MVC 编辑时，如何正确地使我的下拉列表包含模型中的正确信息？我的编辑是使用由 jquery $.ajax 调用填充的动态下拉列表。

这是我的 View 下拉菜单...

@Html.DropDownListFor(m => m.SubdivisionID, new SelectList(new List<SelectListItem>(),
                    "SubdivisionID", "SubdivisionName", Model.SubdivisionID))

我进行了 $.ajax 调用，在 $.ajax 调用运行后，下拉列表中填满了所有选项，但下拉列表仅选择列表中的第一个选项。如何使用模型信息更新下拉列表？

例如，下拉列表可以选择 Item1 或 Item2。该模型将“Item2”保存为 SubdivisionID，但是，在 $.ajax 调用之后，下拉列表在列表中包含“Item1”，因为 Item1 是列表中的第一项。

我应该怎样做才能使下拉列表在编辑中选择正确的项目？

这是我用于 $.ajax 调用的 JavaScript...

function getSubdivisions() {
    custId = $('#CustomerID').val();

    // remove all of the current options from the list
    $('#SubdivisionID').empty();

    // send request for list of subdivisions
    var jqxhr = $.ajax({
        url: '/Schedule/getSubdivisions',
        type: 'POST',
        data: '{ customerId: ' + custId.toString() + ' }',
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        cache: false,
        async: true
    });

    // received list of models...
    jqxhr.done(function (data) {
        if (data == null) return;

        try {
            var ddl = $('#SubdivisionID');

            // add each item to DDL
            $.each(data, function (index, value) {
                ddl.append($('<option></option>', { value: data[index].SubdivisionID }).html(data[index].SubdivisionName))
            });
        }
        catch (ex) {
            alert("Done, but with errors!\n" + ex.message);
        }
    });

    // failed to retrieve data
    jqxhr.error(function (result, errorText, thrownError) {
        alert("Error! Failed to retrieve models! " + errorText + "\n" + thrownError);
    });
}

更新 1: 我更改了 DropDown Razor 代码，但它仍然不起作用(见上文)。 MVC 永远不会选择正确的列表项。我宁愿让 MVC 处理项目选择，也不愿我从 JavaScript 中选择所选项目。我的 JavaScript 位于一个单独的文件中，目前我还没有传递任何参数。

更新 2:我将以下 JavaScript 添加到我的 View 中，并更新了我的 JavaScript 以包含 Matt 的答案。

<script type="text/javascript">
    var js_doEdit = true;
    var subdivisionId = @Model.SubdivisionID
</script>

Answer 1

像这样重新创建后，您应该能够在下拉列表中设置所选项目

$('#SubdivisionID').val('@Model.SubdivisionID');

您可能需要像这样向选择器添加一个选择

$('#SubdivisionID select').val('@Model.SubdivisionID');

希望这有帮助