iCheck复选框全选，并刷新数据表

Question

我在 bootstrap 中将 iCheck 用于复选框样式，但我遇到了一些问题，我无法及时选中/取消选中所有 、 和 dotn 工作刷新数据表，需要刷新页面，或页面本身已刷新。

和高级或公共复选框，当我选择它时，它会保持选中状态，然后我将重新加载页面，，

<div class="table-responsive">
    <table class="table">
        <!-- Start Header -->
        <thead>
            <tr>
                <th>
                    <label class="checkbox checkbox-inline">
                        <input type="checkbox" name="file_id" value="0">
                    </label>
                </th>
                <th>Text Name</th>
                <th>Sixe Date</th>
                <th>Created Date</th>
                <th>Something</th>
                <th>Premium</i>
                </th>
                <th>Public</th>
                <th></th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <th scope="row">
                    <label class="checkbox checkbox-inline">
                        <input id="check" type="checkbox" name="file_id">
                    </label>
                </th>
                <td>Something</td>
                <td>Size</td>
                <td>Date</td>
                <td>Name</td>
                <td>
                    <label class="checkbox checkbox-inline">
                        <input type="checkbox" name="file_premium_only" </label>
                </td>
                <td>
                    <label class="checkbox checkbox-inline">
                        <input type="checkbox">
                    </label>
                </td>
          </tr> 
          <tr>
                <th scope="row">
                    <label class="checkbox checkbox-inline">
                        <input id="check" type="checkbox" name="file_id">
                    </label>
                </th>
                <td>Something</td>
                <td>Size</td>
                <td>Date</td>
                <td>Name</td>
                <td>
                    <label class="checkbox checkbox-inline">
                        <input type="checkbox" name="file_premium_only" </label>
                </td>
                <td>
                    <label class="checkbox checkbox-inline">
                        <input type="checkbox">
                    </label>
                </td>
          </tr> 
    </table>
</div>
<!-- /.table-responsive -->

在这里你可以看到 codepen 示例：

http://codepen.io/anon/pen/QjvomM

Answer 1

如果我正确理解了这个问题，您希望为您的页面提供同时选中/取消选中 iCheck 复选框集合的功能吗？

我通过以下 jQuery 函数实现了与此类似的效果。

function ToggleCheckboxes() {

    var flag = $('#togglebox').is(':checked')

    $("[name='PrintCheck']").each(function () {
        if (flag == true) {
            $(this).iCheck('check');                
        } else {
            $(this).iCheck('uncheck');                
        }
    });

}

该函数被分配给顶部复选框的onchange。然后，这将找到所有名为“PrintCheck”的复选框，并选中或取消选中。

<input type="checkbox" id="togglebox" onchange="ToggleCheckboxes();">

希望这可以帮助！