<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Check Username/Email availability Using Ajax and JQuery</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>Name:
</td>
<td>
<asp:TextBox ID="Name" runat="server" />
</td>
<td>
</td>
</tr>
<tr>
<td> Email Id:
</td>
<td>
<asp:TextBox ID="UsernameOrEmail" runat="server" onchange="UserOrEmailAvailability()" />
</td>
<td>
<div id="Div1" runat="server">
<asp:Label ID="Status" runat="server"></asp:Label>
</div>
</td>
</tr>
<tr>
<td>Address</td>
<td> <asp:TextBox ID="Address" TextMode="MultiLine" runat="server" /></td>
</tr>
</table>
</div>
</form>
<script type="text/javascript" src="Scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
function UserOrEmailAvailability() { //This function call on text change.
$.ajax({
type: "POST",
url: "Default.aspx/CheckEmail", // this for calling the web method function in cs code.
data: '{useroremail: "' + $("#<%=UsernameOrEmail.ClientID%>")[0].value + '" }', // user name or email value
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function(response) {
alert(response);
}
});
}
// function OnSuccess
function OnSuccess(response) {
var msg = $("#<%=Status.ClientID%>")[0];
switch (response.d) {
case "true":
msg.style.display = "block";
msg.style.color = "red";
msg.innerHTML = "User Name Or Email already exists.";
break;
case "false":
msg.style.display = "block";
msg.style.color = "green";
msg.innerHTML = "User Name Or Email Available";
break;
}
}
</script>
</body>
</html>
// default.aspx.cs //
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Data.SqlClient;
public partial class Register : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
[System.Web.Services.WebMethod]
public static string CheckEmail(string useroremail)
{
string retval = "";
SqlConnection con = new SqlConnection("data source=.;initial catalog=rnp;Integrated Security=True");
con.Open();
SqlCommand cmd = new SqlCommand("select Email_id from Login where Email_id=@Email_id", con);
cmd.Parameters.AddWithValue("@Email_id", useroremail);
SqlDataReader dr = cmd.ExecuteReader();
if (dr.HasRows)
{
retval = "true";
}
else
{
retval = "false";
}
return retval;
}
}
// SQL Table //
No comments:
Post a Comment