A simple checked all checkbox with a button

    [javascript]
    <!DOCTYPE html>
    <html lang="es">
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Toggle</title>
    <script src="../js/jquery/jquery-1.6.2.min.js"></script>
    <script>
    $(function() {

    var $boton = $("#checkAll");

    $boton.toggle(function() {

    $boton.text("uncheck All");

    $(".ck-all").prop("checked", true);

    }, function() {

    $boton.text("Check all");

    $(".ck-all").prop("checked", false);

    });

    });
    </script>
    </head>

    <body>

    <div>
    <button id="checkAll" type="button">Check all</button>
    </div>

    <ul>
    <li>1.- <input type="checkbox" name="algo[]" class="ck-all" value="1" /></li>
    <li>2.- <input type="checkbox" name="algo[]" class="ck-all" value="2" /></li>
    <li>3.- <input type="checkbox" name="algo[]" class="ck-all" value="3" /></li>
    <li>4.- <input type="checkbox" name="algo[]" class="ck-all" value="4" /></li>
    </ul>

    <p>5.- <input type="checkbox" name="otro" class="ck-no" value="5" /></p>

    </body>
    </html>
    [/javascript]

    Tags:

    Leave a Reply