Home » Archives for October 2013

How to do Check box check event dynamically?

in , - on 07:21 - No comments

Some times we may have some values are attaching to the checkbox ids, like example below. Using $("[Id*='isAccommadation']") code we can get selected checkbox value and we can do the event operations.

This is not limited to check box. This will applicable for all HTML elements.


<!DOCTYPE html>

<html>

<head>

    <title></title>

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

    <script language="javascript">

        $(document).ready(function() {



            $("[Id*='isAccommadation']").bind("click", function () {

                alert(this.value);

            });



        });

    </script>

</head>

    <body>

        <div id="hai">



        <input type='checkbox' name="1" id='isAccommadation_1' value="JQuery" />JQuery<br/>

        <input type='checkbox' name="2" id='isAccommadation_2' value="Example" />Example<br/>

        <input  type='checkbox' name="3" id='isAccommadation_3' value="Code" />Code<br/>

            </div>

    </body>

</html>

Read more
Labels: ,

Check box checked and unchecked using JQuery

in , - on 06:57 - No comments
By using below code, if we check on one check box, all other check boxes will checked, if we un check all other check boxes will unchecked.


<!DOCTYPE html>

<html>

<head>

    <title></title>

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

    <script language="javascript">

        $('document').ready(function() {

            $('#requestAccommodication').bind("click", doOperations);



        });

        var doOperations = (function () {

            debugger;

            if ($('#hai #requestAccommodication').is(':checked')) {

                $("#hai input[type=checkbox]").each(function () {

                    $(this).prop("checked", true);

                });

            } else {

                $("#hai input[type=checkbox]").each(function () {

                    $(this).prop("checked", false);

                });

            }

        });

    </script>

</head>

    <body>

        <div id="hai">

        <input type="checkbox" id="requestAccommodication" /><br />

        <input type='checkbox' name="1" id='isAccommadation_1' />JQuery

        <input type='checkbox' name="2" id='isAccommadation_2' />Example

        <input  type='checkbox' name="3" id='isAccommadation_3' />Code

            </div>

    </body>

</html>
Read more
Labels: ,