如何获取数据表中使用的选择下拉列表的值答案

【问题标题】：How to get the value of a select dropdown used in datatable如何获取数据表中使用的选择下拉列表的值
【发布时间】：2015-05-22 17:17:01
【问题描述】：

我正在使用 jQuery Datatables 插件，并希望获取用户输入的选择下拉列表的值并使用它，然后再次将其重置为默认值。

HTML：

<td>
    <form id="selectValue">
        <select class="priorityList" name="priorityList">
            <option value="">Select Priority</option>
            <option value="1">Low</option>
            <option value="2">Medium</option>
            <option value="3">High</option>
        </select>
    </form>
</td>

此特定单元格显示在表格的每一行上，用户可以在每一行上选择值。

【问题讨论】：

jQuery get selected option value (not the text, but the attribute 'value')的可能重复
我已经尝试过了，但它不能与数据表插件一起使用，因为我的选择下拉列表在表格中。
@Aditya 你有什么理由在每个单元格中都有一个表格吗？
我在每个单元格中没有多个表单，而是在表格的每一行中使用相同名称的一个表单
检查我的答案，你的下拉菜单不能有重复的名字

标签： jquery datatables jquery-datatables

【解决方案1】：

<td>
   <form id="selectValue">
         <select class="priorityList" name="priorityList1">
                 <option value="">Select Priority</option>
                 <option value="1">Low</option>
                 <option value="2">Medium</option>
                 <option value="3">High</option>
         </select>
   </form>
</td>
<td>
   <form id="selectValue">
         <select class="priorityList" name="priorityList2">
                 <option value="">Select Priority</option>
                 <option value="1">Low</option>
                 <option value="2">Medium</option>
                 <option value="3">High</option>
         </select>
   </form>
</td>

JS

$('select[name=priorityList1]').val()//in some cases, returns null
$('#priorityList1').val()//method 2 this returns null some times

$('#priorityList1 option:selected').val()//this works everytime
//for second priority list
$('select[name=priorityList2]').val()//in some cases, returns null
$('#priorityList2').val()//method 2 this returns null some times

$('#priorityList2 option:selected').val()//this works everytime

 //to change names and Id through Jquery

 $("#" + id).attr('id', 'priority' + counterIndex)
            .attr('name', 'prioty' + counterIndex);

显然您尝试了上述方法，但它不起作用。

确保您只有一个名为 priorityList 的选择
确保您的 ID 是唯一的
只有两个、三个、四个或更多单选按钮可以具有相同的名称，其余的不能：explanation
如果您要自动生成此表单，假设用户输入新行并且您需要自动生成 id，您可以记录用户的输入并使用 Js 函数更改名称/id，您将必须自己写这个。 Here is an example

【讨论】：

返回未定义
但我正在显示一个列表，其中用户必须为每一行选择优先级，但一次选择一个
@Aditya 它返回 undefined 因为你有两个同名的东西，你不能这样做，除非它是一个单选按钮stackoverflow.com/questions/9944559/…
如果我让用户为他从表中选择的每门课程选择优先级该怎么办。一行中也只有一个选择。每行都有优先级下拉，但名称相同。还建议我在每种情况下选择优先级
在一个html文件中你不能有两个同名的下拉菜单，会有冲突。它们是否在不同的行或不同的 div 或不同的跨度等上。您可以随时检查它是否为空而不使用该值。但是您仍然必须单独处理每个优先级，您可以使用 if 语句来查看用户输入了哪个优先级，然后只使用该优先级的名称。但是两个下拉菜单不能具有相同的名称。

【解决方案2】：

这将动态地附加事件处理程序，因此更改选择选项时，它将将“选择”的值设置为您可以使用的变量，然后将值重置为第一个选项。这适用于任意数量的选择框（参见小提琴）。这可根据需要进行配置：

$("#table select").on("change", function(){
    // Get the value from the select box
    var value = $(this).val();

    // Do what you need to do with value        
    alert(value);

    // Reset the select back to the first option
    $(this).val("default");
});

这里有一个 JSFiddle 展示了这一点：https://jsfiddle.net/wk5o1w4u/1/

【讨论】：