获取多个输入类型隐藏值行按钮单击表中的列答案

【问题标题】：Get multiple input type hidden value row button click for column in table获取多个输入类型隐藏值行按钮单击表中的列
【发布时间】：2017-02-12 09:16:09
【问题描述】：

这是我尝试通过按钮操作事件获取隐藏值的单行示例列

<td colspan="2">
    <!-- the hidden value i want to retrieve "stockitemid" and "outletid"  -->
    <!-- value i have bind from controller through model like @item.ID= stockitemid and @item.OUTLET_ID=outletid -->
    <input type="hidden" class="itemid" name="stockitemid" value="@item.ID"/>  
    <input type="hidden" class="oid" name="outletid" value="@item.OUTLET_ID"/>
    <div class="btn-toolbar row-action">
        <div class="btn-group pull-right">
            <!-- button action given below what i have tried to display value in modal form  controller. but every-time i click same value found from this event -->
            <button class="btn btn-primary" id="btnitemaddtotray" data-toggle="modal" data-target="#addtotrayModal" title="Add Item"></button>
        </div>
    </div>
</td>

每次我得到相同的“stockitemid”和“outletid”时，这是我的检索 jquery 代码

<script>
    $('#btnitemaddtotray').click(function() {
       // this is what i have tried to get row index with column index value
       $('td').click(function () {
           var col = $(this).parent().children().index($(this));
           var row =    $(this).parent().parent().children().index($(this).parent());
            alert('Row: ' + row + ', Column: ' + col);
        });  
        // here is itemid and outlet id i got every-time same value. 
        var itemid = $('input[name=stockitemid]').val();
        var outletid =$('input[name=outletid]').val();
    });
</script>

我想从我有多行的表中获取隐藏值。

【问题讨论】：

您不能在.click() 处理程序中拥有.click() 处理程序。并且 suplicare id 属性是无效的 html。改用类名。 - $('.btn').click(function() { var cell= $(this).closest('td'); var itemid = cell.find('.itemid').val(); ... });
谢谢你..它工作得很好。

标签： jquery asp.net-mvc

【解决方案1】：

ID 对于每个元素应该始终是唯一的，因此我使用了一个类。使用parents() 将为您提供find() 隐藏输入的容器以检索值。

$('.btnitemaddtotray').on('click',function() {
  
  var btn = $(this),
      row = btn.parents('td').first();
      itemId = row.find('.itemid').val(),
      oid = row.find('.oid').val();
      
      console.log(itemId,oid);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table><tr>
<td colspan="2">
    <input type="hidden" class="itemid" name="stockitemid" value="@item.ID"/>  
    <input type="hidden" class="oid" name="outletid" value="@item.OUTLET_ID"/>
    <div class="btn-toolbar row-action">
    <div class="btn-group pull-right">
    <button class="btn btn-primary btnitemaddtotray" data-toggle="modal" data-target="#addtotrayModal" title="Add Item">Add Item</button>
    </div></div>
    </td></tr>
<tr>
<td colspan="2">
    <input type="hidden" class="itemid" name="stockitemid" value="@item.ID2"/>  
    <input type="hidden" class="oid" name="outletid" value="@item.OUTLET_ID2"/>
    <div class="btn-toolbar row-action">
    <div class="btn-group pull-right">
    <button class="btn btn-primary btnitemaddtotray" data-toggle="modal" data-target="#addtotrayModal" title="Add Item">Add Item</button>
    </div></div>
    </td></tr>
</table>

【讨论】：