如何使用jquery从dot net core mvc中的表中的下拉列表中显示选定的值

Posted 2023-05-07

【中文标题】如何使用jquery从dot net core mvc中的表中的下拉列表中显示选定的值

【英文标题】：How to show Selected value from dropdown inside table in dot net core mvc with jquery

【发布时间】：2022-01-24 07:30:24

【问题描述】：

'''
$.ajax(
            type: "POST",
            url: '@Url.Action("GridData", "PeriodOpenclose")/',
            dataType: "json",
              success: function (response) 
                  debugger
                if (response.data.length > 0) 
                    $.each(response.data, function (i, List) 
                        var newRow = $("<tr>");
                        var cols = "";
cols += '<td> <select id="dropdowntype"  class="form-control"><option value="1">Open </option> <option value="2">Close </option></select ></td > ';
                        $("#dropdowntype").val($("#dropdowntype option:selected").val(List.periodstatus));
'''

我在表格中添加了这个，我添加了选择标签并添加了手动选项。我在 List.periodstatus 中选择值 2，我无法在下拉列表中显示所选值。

【问题讨论】：

我对代码感到困惑，你什么时候在你的html中添加cols？因为在您致电$("#dropdowntype") 之前，您会使用cols += '<td> ，但从不使用cols

我也不确定你在这里做什么$("#dropdowntype").val($("#dropdowntype option:selected").val(List.periodstatus));

忽略 $("#dropdowntype").val($("#dropdowntype option:selected").val(List.periodstatus));这只是我会将 cols 附加到表中，但主要问题是假设如何在此下拉列表中设置选定的值，我想将 List.periodstatus 设置为此下拉列表作为值

你从来没有向我们展示你如何将cols 附加到html，如果你不附加它，那么你不能使用$("#dropdowntype")

【参考方案1】：

如果要设置<select></select>的selected option，id为dropdowntype，只需更改cols，然后将cols添加到html中即可。

var cols = "";

            cols += '<select id="dropdowntype"  class="form-control">';
            for (var j = 1; j <= 2; j++) 
                if (j == List.periodstatus) 
                    cols += '<option value="' + j + '" selected>Open </option>';
                 else 
                    cols += '<option value="' + j + '">Open </option>';
                
            
            cols += '</select >';

使用代码后，selected 将添加到option 中，cols 中的值为List.periodstatus。