如何使用動態javascript下拉菜單進行MVC編輯

Question

在進行MVC編輯時，如何正確地使下拉菜單具有來自模型的正確信息？ 我的編輯使用的是由$ query.ajax調用填充的動態下拉列表。

這是我的觀點下拉列表...

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

我進行了$ .ajax調用，並在$ .ajax調用運行后，下拉列表填充了所有選項，但下拉列表僅選擇了列表中的第一個。 如何獲得下拉菜單以更新模型信息？

例如，下拉列表可以選擇Item1或Item2。 該模型將“ Item2”保存為SubdivisionID，但是，在$ .ajax調用之后，下拉列表在列表中具有“ Item1”，因為Item1是列表中的第一項。

如何使下拉菜單在“編輯”中選擇正確的項目？

這是我的JavaScript，用於$ .ajax調用...

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，並更新了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');

希望這可以幫助

Answer 2

解決此問題的2種方法：

1。

 $("#YourDropDownList").val(@Model.SubdivisionID);

2。

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

它將自動將您的數據值與“ SubdivisionID”進行匹配。