无法在 ASP.NET MVC 的 DropDownList 中检索选定的值？

Question

正在尝试在 ASP.NET MVC 中检索我的 DropDownList 的选定值。我正在使用以下代码：

HTML

 grid.Column("Other", header: "Other", format: @<text>@Html.DropDownList("OtherKey", (IEnumerable<SelectListItem>)ViewBag.OtherKeysList, new { @class = "extra-class" })</text>)))

结果如下：

正在尝试使用以下代码检索我的 DropDownList 的选定值（在本例中为：otherkey3、otherkey2、otherkey1）：

 <script type="text/javascript">

       var dict = [];

       $('#btnSubmit').click(function (e) {
           $('#tableID  > tbody  > tr >  td').each(function () {
               $('#OtherKey > option').each(function () {
                   console.log(($(this).val()));
               });
           });
       });

   </script>

但是这不起作用，我得到以下输出：

有人看到我做错了什么吗？

提前致谢！

Answer 1

这里有几个问题。首先，您将获得每个 <option> 的值，因此它将始终 return 所有选项，无论是否选中。在 <select> 本身上使用 .val() 来获取当前选择的值：

console.log($('#OtherKey').val());

但是，您的 HTML 中的 OtherKey ID 似乎也是您的 re-using。查看您的 server-side 代码生成的实际 HTML。如果 ID 不是唯一的，那么使用这些 ID 的 JavaScript 代码的行为是未定义的。

您的元素确实使用了 class，因此您可以改用它。（如果这些元素不是唯一的，那么您可以为它们分配一个额外的 class 。）像这样：

$('.extra-class').each(function () {
    console.log(($(this).val()));
});

另请注意，您不需要通过 <select> 元素遍历 table 行和行，只需后者即可。除非您出于此处未显示的某些其他原因特别需要识别您的 table 行。

无法在 ASP.NET MVC 的 DropDownList 中检索选定的值？

Unable to retrieve selected value in DropDownList in ASP.NET MVC?

javascript

jquery

loops

webgrid

drop-down-menu