Razor视图循环中DropDownList选中值无法回显的解决求助

问题分析 #

你当前代码失效的核心原因有两个：

1. jQuery选择器匹配错误：生成的select元素name属性是[@i].NoaeFactor（比如[0].NoaeFactor、[1].NoaeFactor），但你的JS里用$("select[name='NoaeFactor']")去匹配，这个选择器只会找name严格等于NoaeFactor的元素，自然找不到任何目标select。
2. 依赖DOM结构的选择器不够健壮：用prev()获取隐藏输入框的方式，一旦DOM结构调整（比如在hidden和select之间加了其他元素）就会失效。

下面提供两种解决方案，优先推荐第一种（后端直接渲染，更高效可靠）：

方案一：后端直接渲染选中状态（无需JS） #

直接在循环渲染option时，根据当前模型的值判断是否添加selected属性，不需要额外的隐藏输入框和JS代码，这是最可靠的方式：

@for (var i = 0; i < Model.Count(); i++)
{
    // 提前获取当前项，避免多次调用ToList()影响性能
    var currentItem = Model.ToList()[i];
    <tr>
        <td>@currentItem.TaminKoonandeName</td>
        <td>
            <select class="mt-1 form-control" name="[@i].NoaeFactor" style="font-size: 12px; width: 130px" required autocomplete="off">   
                <option value="" @(string.IsNullOrEmpty(currentItem.NoaeFactor) ? "selected" : "")>انتخاب کنید</option>
                <option value="1" @(currentItem.NoaeFactor == "1" ? "selected" : "")>خرید</option>
                <option value="2" @(currentItem.NoaeFactor == "2" ? "selected" : "")>برگشت از خرید</option>   
            </select>
         </td>
    </tr>
}

方案二：修复JS代码（保留原DOM结构） #

如果你一定要用JS来设置选中值，需要修正选择器并优化隐藏框的查找方式：

1. 给select添加一个专属类（比如noae-factor-select），方便准确选择；
2. 用siblings()替代prev()来查找同级的隐藏输入框，避免依赖固定的DOM顺序。

修改后的完整代码：

@for (var i = 0; i < Model.Count(); i++)
{
    var currentItem = Model.ToList()[i];
    <tr>
        <td>@currentItem.TaminKoonandeName</td>
        <td>
            <input type="hidden" class="hf_selected_val" value="@currentItem.NoaeFactor" />

            <select class="mt-1 form-control noae-factor-select" name="[@i].NoaeFactor" style="font-size: 12px; width: 130px" required autocomplete="off">   
                <option value="">انتخاب کنید</option>
                <option value="1">خرید</option>
                <option value="2">برگشت از خرید</option>   
            </select>
         </td>
    </tr>
}      

<script>
    $(function () {
        // 通过类选择器找到所有目标select
        $(".noae-factor-select").each(function () {
            // 查找同级的隐藏输入框
            var selectedVal = $(this).siblings(".hf_selected_val").val();
            if (selectedVal && selectedVal !== "") {
                $(this).val(selectedVal);
            }
        })
    })
</script>

内容的提问来源于stack exchange，提问作者sadegh farest