Question

我有一张桌子，每排都包含一个按钮和一些元素。我想在单击按钮时获取其中一些元素的值，然后将其传递给Ajax调用。

我的问题是获得这些元素的价值。

表格行如下所示：

<tr>
    <td>
        <input id="item_AllocationId" name="item.AllocationId" type="hidden" value="39">
        <input class="form-control input-width-medium text-box single-line" data-val="true" data-val-required="The Description field is required." id="item_Description" name="item.Description" type="text" value="Welcome Centre Rent">
    </td>
    <td>
        <div class="checker" id="uniform-item_GiftAidable"><span><input class="uniform checkbox" id="item_GiftAidable" name="item.GiftAidable" type="checkbox" value="true"></span></div><input name="item.GiftAidable" type="hidden" value="false">
    </td>
    <td>
        <div class="checker" id="uniform-isActive"><span class="checked"><input checked="checked" class="uniform checkbox" id="isActive" name="item.IsActive" type="checkbox" value="true"></span></div><input name="item.IsActive" type="hidden" value="false">
    </td>
    <td>
        <input class="update-allocation" type="submit" name="update-allocation" value="Update">
    </td>

</tr>

和jQuery：

$(document).ready(function () {
    $('.update-allocation').click(function (event) {
        var isactive = $(this).parent().find('#isActive:checkbox:checked');
        alert(isactive);
    });
});

至少找到一个对象，但是只要我在那里但是.val（）就会出现未定义的内容。

这是jsFiddle

我是朝着正确的方向前进吗？或者我在DOM中完全迷失了？

仅供参考使用ASP.Net Razor生成HTML。

Answer 1

这是一个例子的小提琴 https://jsfiddle.net/m0nk3y/owoze110/5/

我所做的是缓存父行<tr>，然后将其用作参考。从那里你可以找到特定字段的值。我在这个例子中做了描述：

$('.update-allocation').click(function (event) {
    var $row = $(this).parents('tr');
    var desc = $row.find('input[name="item.Description"]').val();
    var gift = $row.find('input[name="item.GiftAidable"]').is(':checked');
    var isActive = $row.find('input[name="item.IsActive"]').is(':checked');

    alert('description: ' + desc + '\ngift aidable: ' + gift + '\nis active: '+isActive);
});

此外，我注意到您为所有输入使用相同的ID属性。我建议你改用class，因为你应该只有一个ID实例。如果您还有其他问题，请与我们联系。祝你好运。

Answer 2

jQuery 总是* 返回一个对象。在这种情况下，它返回的对象是空的，您无法通过简单的alert(isactive)来判断（尽管您可以执行alert(isactive.length)）。

问题在于以下代码：

$(this).parent().find('#isActive:checkbox:checked')

.update-allocation的父级是td元素，不包含#isActive。

我建议使用.closest来获取最近的父tr：

$(this).closest("tr").find('#isActive:checkbox:checked')

请参阅更新的小提琴：http://jsfiddle.net/owoze110/1/

_{_{*除非你调用类似.is的函数，否则}}

单击按钮时获取元素的值，每行一个按钮

2 个答案: