webdevelopment: Select All - onclick single select box need select all check boxes

Friday, 26 August 2016

Select All - onclick single select box need select all check boxes

Select All - onclick single select box need select all check boxes

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>

<body>

<h2> This is for select all check boxes with <strong>single check box</strong></h2>
<input type="checkbox" id="ckbCheckAll" /> Select All
    <p id="checkBoxes">
        <input type="checkbox" class="checkBoxClass" id="Checkbox1" /> Radio
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox2" /> TV
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox3" /> Mobile
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox4" /> Tablet
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox5" /> Laptop
        <br />
    </p>
    
    <script>
    $(document).ready(function () {
    $("#ckbCheckAll").click(function () {
        $(".checkBoxClass").prop('checked', $(this).prop('checked'));
    });
});</script>
</body>
</html>

webdevelopment

Pages

Friday, 26 August 2016

Select All - onclick single select box need select all check boxes

No comments:

Post a Comment