mercredi 1 novembre 2017

Check/Uncheck all checkboxes with php

enter image description here

14 is dynamic.! for every new div its gets changed example: 1,4,6,12 unique..

<div id="tabs-14" class="tab-pane  active">  
    <div class="panel-body">
        <div class="row">
            <div class="col-md-3">
                <div class="checkbox">
                    <label>
                        <input type="checkbox" class="SelectAll_Dynamic" id="14">
                        <b>Select All</b>
                    </label>
                </div>
            </div>
            <div class="col-md-3">
                <div class="checkbox">
                    <label>
                    <input type="checkbox" name="pages[]" value="41" checked="">Reservations</label>
                </div>
            </div>
            <div class="col-md-3">
                <div class="checkbox">
                    <label>
                    <input type="checkbox" name="pages[]" value="52" checked="">Customers</label>
                </div>
            </div>
        </div>
    </div>
</div>

I want to execute a function after page load, which should check whether all checkboxes are checked or not, apart from the first one which has SelectAll_Dynamic class

If all child checkboxes selected then the parent should get selected how can I achieve that..?

This is the functionality which I have for check/uncheck all

$('.SelectAll_Dynamic').click(function() {
                var select_Id = this.id;
                var checked = $(this).prop('checked');
                $('#tabs-'+select_Id).find('input:checkbox').prop('checked', checked);
            });
            $('.tab-pane').find('input:checkbox:not(:first)').click(function() {
                if (!$(this).is(':checked')) {
                    $(this).closest('.tab-pane').find('input:checkbox:first').prop('checked', false);
                    } else {
                    var checkbox_length = $(this).closest('.tab-pane').find('input:checkbox:not(:first)').length;
                    var checked_check_box_length = $(this).closest('.tab-pane').find('input:checkbox:not(:first):checked').length;
                    if (checkbox_length == checked_check_box_length) {
                        $(this).closest('.tab-pane').find('input:checkbox:first').prop('checked', true);
                    }
                }
            });

This is my dynamic php code:

<div class="tab-content vehicle">
<?php  $active='active'; foreach ( $check_menu as $y) { ?>
<div id="tabs-<?=$y?>" class="tab-pane <?=$active?>">
    <div class="panel-body">
        <div class="row">
            <div class="col-md-3">
                <div class="checkbox">
                    <label>

                        <input type="checkbox" class="SelectAll_Dynamic" id="<?=$y?>"  />
                        <b>Select All</b>
                    </label>
                </div>
            </div>
            <?php  foreach($menus as $x): if ($x['parent_id'] ==$y):?>
            <div class="col-md-3">
                <div class="checkbox">
                    <label>
                        <input type="checkbox" name="pages[]" value="<?=$x['id']?>"
                        <?php   if (array_search($x['id'],$my_menu,true))
                            {
                                echo "checked ";
                            }
                        ?>
                        ><?=$x['name']?></label>
                    </div>
                </div>


                <?php  endif; $active="";
                endforeach;?>

            </div></div>
    </div>
<?php } ?>
</div>

My expected results are:

<input type="checkbox" class="SelectAll_Dynamic" id="14" checked> //checked

if all child checkboxes are cheked.!




Aucun commentaire:

Enregistrer un commentaire