Basic of JQuery Get or Set Controls Values in Asp.Net

Basic of JQuery Get or Set Controls Values in Asp.Net 

How to Access Basic Asp.Net Controls Using in JQuery.
  Basic JQuery Use To Get Or Set Values Using Asp.NET Controls.

Download Coding

HTML CODING

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
   <script type="text/javascript">
      
       // Button Click or Not

       $(document).ready(function(){
           $("#Button1").click(function(){          
               alert("Button Clicked");
           });
       });

       // Label Value Get Button Click

       $(document).ready(function () {
           $("#Button1").click(function () {            
               var lbl = $("#Label1").html();
               alert(lbl);
           });
       });

       // Textbox Values Get Button Click

       $(document).ready(function () {
           $("#Button1").click(function () {            
               alert($("#TextBox1").val());
           });
       });

       // DropDownlist Selected Values Get After Button Click

       $(document).ready(function ()
       {
           $("#Button1").click(function ()
           {
              alert($('#<%=DropDownList1.ClientID%>').text());
              alert($('#<%=DropDownList1.ClientID%>').val());
           });
       });

       // CheckBox Check Checked or Unchecked

       $(document).ready(function () {
           $("#Button1").click(function () {
               if ($("#CheckBox1").is(':checked')) {
                   alert('CheckBox Checked')
               }
               else {
                   alert('CheckBox Unchecked')
               }
           })

       })
     

       // Radiobutton Ckeck Checked or Unchecked

       $(document).ready(function () {
           $("#RadioButton1").click(function ()
           {
               ($("#<%=RadioButton1.ClientID%>").attr('checked',true))
               {
                   alert($("#RadioButton1").val());
               }             

           });
       });

   </script>
</head>
<body>
    <form id="form1" runat="server">
    <div align="center">
        <asp:Button ID="Button1" runat="server" Text="Button"  />
        <asp:CheckBox ID="CheckBox1" Text="Checkbox" runat="server"  />
        <asp:Label ID="Label1" runat="server"  Text="Dotnet"></asp:Label>
        <asp:TextBox ID="TextBox1" Text="Dotnet" runat="server"></asp:TextBox>
        <asp:DropDownList ID="DropDownList1"  runat="server">
            <asp:ListItem>A</asp:ListItem>
            <asp:ListItem>B</asp:ListItem>
            <asp:ListItem>C</asp:ListItem>
        </asp:DropDownList>
        <asp:RadioButton ID="RadioButton1" Text="RadioButton"  runat="server" GroupName=""/>

    </div>
    </form>
</body>
</html>

DEMO

 // Button Click or Not

 $(document).ready(function(){
           $("#Button1").click(function(){          
               alert("Button Clicked");
           });
       });



// CheckBox Check Checked or Unchecked

       $(document).ready(function () {
           $("#Button1").click(function () {
               if ($("#CheckBox1").is(':checked')) {
                   alert('CheckBox Checked')
               }
               else {
                   alert('CheckBox Unchecked')
               }
           })

       })


 // Label Value Get Button Click

       $(document).ready(function () {
           $("#Button1").click(function () {            
               var lbl = $("#Label1").html();
               alert(lbl);
           });
       });





 // Textbox Values Get Button Click

       $(document).ready(function () {
           $("#Button1").click(function () {            
               alert($("#TextBox1").val());
           });
       });



 // DropDownlist Selected Values Get After Button Click

       $(document).ready(function ()
       {
           $("#Button1").click(function ()
           {
             alert($('#<%=DropDownList1.ClientID%>').val());
           });
       });








 // DropDownlist Selected Values Get After Button Click

       $(document).ready(function ()
       {
           $("#Button1").click(function ()
           {
              alert($('#<%=DropDownList1.ClientID%>').text());
             
           });
       });





       // Radiobutton Ckeck Checked or Unchecked

       $(document).ready(function () {
           $("#RadioButton1").click(function ()
           {
               ($("#<%=RadioButton1.ClientID%>").attr('checked',true))
               {
                   alert($("#RadioButton1").val());
               }             

           });
       });









Enquiry Form Open Page Load and Send Email Using in Web Service,HtmlPage Using Asp.Net C# JQuery

Enquiry Form Open Page Load and Send Email Using in Web Service,HtmlPage

Enquiry Form Open Page Load - Email Send To Users  Using Web Service & HtmlPage.html  in JQuery,JavaScript With GoogleApis in Asp.Net C#(Without Using WebForm).

                             Download Coding
                                                 Download

                                      DEMO



                       HTML CODING(HtmlPage.html)


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Enquery Form Open Page Load and Send Email Using in Web Service,HtmlPage Using  Asp.Net C# JQuery</title>

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<style type="text/css">

.popup{
width: 100%;
margin: 0 auto;
display: none;
position: fixed;
z-index: 101;
}
.bor{
min-width: 600px;
width: 600px;
min-height: 350px;
margin: 100px auto;
background: #808080;
position: relative;
z-index: 103;
padding: 10px;
border-radius: 5px;
}
.bor .clo{
float: right;
height: 35px;
left: 22px;
position: relative;
top: -25px;
width: 34px;
}
#drizz {
position: fixed;
width: 100%;
height: 100%;
background-color: #FF9933;
display: none;
}
</style>
<script type='text/javascript'>
    $(function () {
        var overlay = $('<div id="drizz"></div>');
        overlay.show();
        overlay.appendTo(document.body);
        $('.popup').show();
        $('.close').click(function () {
            $('.popup').hide();
            overlay.appendTo(document.body).remove();
            return false;
        });
        $('.clo').click(function () {
            $('.popup').hide();
            overlay.appendTo(document.body).remove();
            return false;
        });

    });
</script>

    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css"
        rel="stylesheet" type="text/css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
    <script>
        function SendMail() {
            $("#Button1").click(function () {
                $.ajax({
                    url: "WebService.asmx/MailSend",
                    data: "{ 'To': '" + $('input[id$=Text1]').val() +
                  "', 'Message': '" + $('input[id$=Text2]').val() + "' }",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        if (data.d == 1) {
                            alert('Success');

                            $('.popup').hide();
                            overlay.appendTo(document.body).remove();
                            return false;
                        }
                      
                    }
                });
            });
        }
</script>  
 
</head>
<body>

    <div class='popup'>
<div class='bor'>
<img src='drop.gif' alt='quit' runat="server" class='clo'  id='x' />

     <table><tr><td>To</td><td>
    <input id="Text1" type="text" /></td></tr>
        <tr><td>Message</td><td>
    <input id="Text2" type="text" /></td></tr>
        <tr><td colspan="2">    
    <input id="Button1"  type="button"  onclick ="SendMail();" value="SEND MAIL"  /></td></tr>

    </table>
    <a href="" class='close'>Hide</a>
</div>
        </div> 
  
</body>

</html>

                           Web Service.asmx


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Net.Mail;

/// <summary>
/// Summary description for WebService
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {  
    [WebMethod]
    public  int MailSend(string To, string Message)
    {      
        MailMessage Msg = new MailMessage();
        Msg.From = new MailAddress("SenderMail@gmail.com"); // Sender e-mail address.
        Msg.To.Add(To);// Recipient e-mail address.
        Msg.Subject = "Send Mail Using WebServices";
        Msg.Body = Message;
        Msg.IsBodyHtml = true;     
        SmtpClient smtp = new SmtpClient();
        smtp.Host = "smtp.gmail.com";
        smtp.Port = 587;
        smtp.Credentials = new System.Net.NetworkCredential("YourMailId@gmail.com""Password");
        smtp.EnableSsl = true;
        smtp.Send(Msg);
        return 1;      
    }
   
}



First - Add New HtmlPage.html Form  






Next - Add Input Button.Button From ToolBox






Next - Add - Web Service.asmx From Solution Explorer






Next Add - Enquiry Form Open & Close JavaScript Add 





Next - Add JQuery,GoogleApi  &  JQuery Function From WebService.asmx






Next - Add - NameSpace(using System.Net.Mail)Email Send Coding  in WebService.asmx  Input Call From HtmlPage.html