Question

我使用jquery动态创建了一个表，它有一个复选框 chkBoxSelected

我只遍历已检查的行。通过ajax发布后我想取消选中框，但它只执行第一个而不是其他框。

 $('#chkBoxSelected').prop("checked", false).filter(':has(:checkbox:checked)');

完整代码：

表：

<table id="tblServices" class="table table-responsive ">
      <thead class="table-header">
                                <tr>
                                    <th>S.No</th>
                                    <th>Service Name</th>
                                    <th>Service Price</th>

                                </tr>
                            </thead>
                            <tbody id="tbodytblServices" class="tableBody"></tbody>

                        </table>

表生成代码：

 function fillServicesGrid() {

            var url = '@Url.Action("GetServices")';
            var data = ''

            $.get(url, data, function (response) {

                $("#tbodytblServices").html("");

                $.each(response, function (i, val) {

                    $("#tbodytblServices").append($('<tr>').attr('id', 'trServiceRecord').append($('<td>').attr('id', "tdServiceID" + i).html(val.ServiceID)).append($('<td>').attr('id', "tdServiceName" + i).html(val.ServiceName)).append($('<td>').attr('id', "tdServicePrice" + i).html(val.ServicePrice)).append($('<input type="checkbox" class="selectColumn" id="chkBoxSelected" />')));

                });

            });



        }

数据提交：

 function selectService() {

        var i = 0;

        $("#tblServices tr").filter(':has(:checkbox:checked)').each(function () {

            i = 1; // to check if the looping has been done or not

            var url = '@Url.Action("CreateInvoice")';
            var data = { fk_BookingID: $("#Booking_ID").val(), fk_ServiceID: $("td:eq(0)", this).text() }

            $.post(url, data, function (response)
            {
                if (response.ReturnStatusJSON === true) {                       

                    swal("Done", response.ReturnMessageJSON, "success");
                }
                else
                {
                    swal("Sorry !", response.ReturnMessageJSON, "error");
                }


            });




        });

Answer 1

选择checkboxes，class而非id。 #chkBoxSelected是一个ID，它是唯一的并且用于一个，所以应该使用class来选择所有复选框。

＆＃13;

$('.selectColumn').prop("checked", false).filter(':has(:checkbox:checked)');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="selectColumn" checked/>
<input type="checkbox" class="selectColumn" checked/>
<input type="checkbox" class="selectColumn" checked/>
<input type="checkbox" class="selectColumn" checked/>

＆＃13;

另请注意，您应为每个ID生成唯一的checkbox，以避免重复ID

当我使用jquery循环和取消选中复选框时，为什么不取消选中复选框？

1 个答案: