Choose Your Language

Thursday 10 April 2014

Checking User Name Availability Using AJAX, JSP And MySQL and javascript

 userregistration.jsp
<%--
    Document   : userregistration
    Created on : 17 May, 2013, 11:22:42 AM
    Author     : Aravind Sankaran
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <script type="text/javascript">
          function validateForm()
            { 
            var x=document.forms["login"]["username"].value;
            var y=document.getElementById('actual').value;           
           
                if (y=="taken")
                {
                       alert("Name already exist in database");
                    return false;
                }else
                {
                        alert("No name exist");
                }
                   
                   
             }
        </script>
        <script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
var k=document.getElementById("username").value;
var urls="checkusername.jsp?ver="+k;

if (window.XMLHttpRequest)
  {
  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4)
    {
        document.getElementById("err").innerHTML=xmlhttp.responseText;
     }
  }
xmlhttp.open("GET",urls,true);
xmlhttp.send();
}
</script>
    </head>
    <body bgcolor="black">
        <form name="login" method="get" action="" onsubmit="return validateForm();">
        <p>
    <center>
        <font color="white">User Name: </font><input type="text" name="username" id="username" onkeyup="loadXMLDoc()"><br>
        <span id="err"> </span>
    </center>
        </p>
        </form>
    </body>
</html>

checkusername.jsp
<%--
    Document   : checkusername
    Created on : 9 May, 2013, 12:42:25 PM
    Author     : Aravind Sankaran
--%>

<%@ page import="java.io.*,java.sql.*" %>
<%@ page contentType="text/html" pageEncoding="UTF-8"%>

<%
                    String sn=request.getParameter("ver");
                    Class.forName("com.mysql.jdbc.Driver");
                    Connection con =DriverManager.getConnection("jdbc:mysql://localhost:3306/daodatabase","root","root");
                    Statement st=con.createStatement();
                    ResultSet rs = st.executeQuery("select * from usertable where username='"+sn+"'");  // this is for name
                    if(rs.next())
                    {   %>
                        <font color=red>
                        Name already taken
                        <input type="hidden" id="actual" name="actual" value="taken">
                        <input type="submit" value="submit">
                        </font>

                   <% }else {%>
                        <font color=green>
                        <input type="hidden" id="actual" name="actual" value="available">
                        Available
                        </font>
                        <input type="submit" value="submit">
                   <% }%>
                   
     <%              
rs.close();
st.close();
con.close();
%>

web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
    <session-config>
        <session-timeout>
            30
        </session-timeout>
    </session-config>
    <welcome-file-list>
        <welcome-file>userregistration.jsp</welcome-file>
    </welcome-file-list>
</web-app>


4 comments: