Автоопределение и проверка всех для этого столбца таблицы - PullRequest
1 голос
/ 02 апреля 2011

Я пытаюсь сделать проверку, чтобы после щелчка отмечались все поля в этом конкретном столбце таблицы. Так, скажем, если это было в столбце 3: при нажатии он будет проверять все флажки, которые находятся во всех строках столбца 3. Но я также хочу, чтобы он обнаруживал, в каком столбце он находится.

Вот то, что я имею до сих пор, у меня есть для того, чтобы сделать одно или другое, но не оба одновременно:

            $('.checkall').click(
                function(){
                    var col = $(this).parent().children().index($(this));
                    $(this).parent().parent().parent().parent().find("td:eq("+col+") input[type='checkbox']").attr('checked', $(this).is(':checked'));   
                }
            );

Ответы [ 2 ]

1 голос
/ 02 апреля 2011

Это должно работать:

$(".checkall").click(function(){
    var $table = $(this).closest("table");
    var col = $(this).closest("tr").children().index($(this).closest("td"));
    var index = col + 1; // offset for nth-child
    $table.find("td:nth-child("+index+") input:checkbox").attr("checked",$(this).is(":checked"));
});

jsfiddle.net

0 голосов
/ 02 апреля 2011

Это сделает работу.Прокомментируйте, если это не совсем то, что вы хотите

HTML:

<table border="1">
    <tr>
        <td>All<input type="checkbox" value="" class="checkAll"></td>
        <td><input type="checkbox" value=""></td>
        <td><input type="checkbox" value=""></td>
        <td><input type="checkbox" value=""></td>
    </tr>
    <tr>
        <td>All<input type="checkbox" value="" class="checkAll"></td>
        <td><input type="checkbox" value=""></td>
        <td><input type="checkbox" value=""></td>
        <td><input type="checkbox" value=""></td>
    </tr>
</table>

javascript:

<script type="text/javascript">
    $('tr').find('input:checkbox').not('.checkAll').change(function()
    {
        var checkboxes = $(this).parent().parent().find(':checkbox').not('.checkAll');
        var checkAll = $(this).parent().parent().find('.checkAll');
        if (!checkboxes.not(":checked").not(".checkAll").length)
            checkAll.attr("checked", true);
        if (!checkboxes.filter(":checked").not(".checkAll").length)
            checkAll.attr("checked", false);

    });
    $(".checkAll").change(function()
    {
        $(this).parent().parent().find(':checkbox').attr('checked', this.checked);
    });
</script>
...