Search

Monday, July 7, 2014
0 comments

How to check RadioButton or CheckBox is checked or not using JQuery

6:57 AMMonday, July 7, 2014
Welcome to JQuery, using ID property of HTML element you can get attribute of element in JQuery. If you want to get any element in JQuery, Should create a function in <Script> </Script> block, now your code look like.

<script type="text/javaScript">
$(function( ) { } );
</Script>

Now, if you want to handle function on button_click event then you must retrieve button_id using '#' after that you will handle any event on it like click. Today we will learn , how to check status of control like checked or not, first to get id of that control. Also check it using this function

is(':checked')


Note :  Must add     <script src="Scripts/jquery-1.10.2.js"></script> in your head section of page . I have visual studio 2013 so i use 1.10.2. You can also use 1.8.2.js file 

Now your complete code is 


<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default2.aspx.vb" Inherits="Default2" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Jquery radiobutton and checkbox status check</title>
    <script src="Scripts/jquery-1.10.2.js"></script>
    <script>
        $(function () {
            $('#bt').click(function () {

                var rdchk = $('#Radio1').is(':Checked');
                var ckchk = $('#Checkbox1').is(':Checked');
                alert("radio button status "+rdchk+" check box status "+ckchk);


            })


        });


    </script>
    <style type="text/css">
        #Radio1 {
            height: 32px;
            width: 174px;
            color :black;
        }
        #Checkbox1 {
            height: 69px;
            width: 83px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
        <input id="Radio1" type="radio" value="Gender" /></div>
        <input id="Checkbox1" type="checkbox" /><br />
    <button id="bt">Check Staus</button>
    </form>
   
        
</body>
</html>

Code generate the following code

How to check RadioButton or CheckBox is checked or not using JQuery

Protected by Copyscape Online Copyright Protection Software

0 comments :

Post a Comment

 
Toggle Footer
Top