Showing posts with label JDBC. Show all posts
Showing posts with label JDBC. Show all posts

JSF login and register application

In this example we are going to create a login and signup application using JSF framework. I am planning to use the below technologies to create the whole application.

  1. Eclipse IDE
  2. Tomcat server
  3. JSF framework
  4. Mysql Database
Before you proceed, make sure you have above software up and running. Also, we need to have some of the dependency jar files in order to compile and run the project. I am going to include the complete source code including the jsf and mysql jar files at the end of this tutorial. You can also go ahead and download it from online resources.


Now, open up the eclipse IDE and create the dynamic web project and set the project structure as below.

Project Structure



Lets design the database table and schema. You can turn on your mysql connection and copy the below db script into your mysql client.

Mysql DB script:

CREATE TABLE `user` (
 `firstname` varchar(15) NOT NULL,
 `password` varchar(15) DEFAULT NULL,
 `lastname` varchar(15) DEFAULT NULL,
 `email` varchar(45) DEFAULT NULL,
 PRIMARY KEY (`firstname`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

Now, lets create the context.xml file under META-INF folder. This file will hold the database connection information and also we can configure the datasource into this file.

context.xml

<?xml version="1.0" encoding="UTF-8"?>
<Context>
    <Resource name="jdbc/database" auth="Container" type="javax.sql.DataSource"
        username="root" password="password" driverClassName="com.mysql.jdbc.Driver"
        url="jdbc:mysql://localhost:3306/appdb" />
</Context>


Now, we are going to create the front end using some xhtml files.

index.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<h:html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core">

<f:loadBundle basename="resources.application" var="msg" />

<h:head>
<title><h:outputText value="#{msg.welcomeTitle}" /></title>
</h:head>

<h:body>
    <h3>
        <h:outputText value="#{msg.welcomeHeading}" />
    </h3>
    <p>
        <h:outputText value="#{msg.welcomeMessage}" />
    </p>
</h:body>
</h:html>


error.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core">

<h:head>
    <title>Error</title>
</h:head>
<h:body>
    <f:view>
        <p>
            <b>Sorry, either name or password is incorrect please try again</b>
        </p>
        <p>
            <h:outputLink value="login.xhtml">Login Again</h:outputLink>
        </p>
    </f:view>
</h:body>
</html>


home.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core">

<h:head>
    <title>Home Page</title>
</h:head>
<h:body>
    <h:panelGrid id="panel" columns="2" border="1" cellpadding="10"
        cellspacing="1">
        <f:facet name="header">
            <h:outputText value="Welcome to the Java and J2EE Tutor" />
        </f:facet>
        <h:outputLabel value="Already a user" />
        <h:outputLink value="login.xhtml">Sign In</h:outputLink>
        <h:outputLabel value="Not a member yet" />
        <h:outputLink value="register.xhtml">Sign Up</h:outputLink>
        <f:facet name="footer">
            <h:panelGroup style="display:block; text-align:center">
                <h:outputLabel value="Created by Amzi" />
            </h:panelGroup>
        </f:facet>
    </h:panelGrid>
</h:body>
</html>


login.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core">

<h:head>
    <title>Login Page</title>
</h:head>
<h:body>
    <f:view>
        <h:form id="loginForm">
            <table frame="box">
                <tr>
                    <th>Login Page</th>
                </tr>
                <tr>
                    <td><h:outputText value="Enter Your Name : " /></td>
                    <td><h:inputText id="inputName" value="#{user.firstName}"
                            required="true" requiredMessage="Name field must not be empty" />
                    </td>
                    <td><h:message for="inputName" style="color:red" /></td>
                </tr>
                <tr>
                    <td><h:outputText value="Enter password :" /></td>
                    <td><h:inputSecret id="inputPassword" value="#{user.password}"
                            required="true"
                            requiredMessage="Password field must not be empty" /></td>
                    <td><h:message for="inputPassword" style="color:red" /></td>
                </tr>
                <tr>
                    <td><h:commandButton value="Sign In" action="#{user.login}" /></td>
                    <td><h:outputText value="Not a User " /> 
                        <h:outputLink value="register.xhtml">Sign Up</h:outputLink>
                    </td>
                </tr>
            </table>
        </h:form>
    </f:view>
</h:body>
</html>


register.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core">

<h:head>
    <title>Registration Page</title>
</h:head>
<h:body>
    <f:view>
        <h:form id="registerForm">
            <table>
                <tr>
                    <td><h:outputText value="Enter Your First Name:" /></td>
                    <td><h:inputText id="fname" value="#{user.firstName}"
                            required="true" requiredMessage="Please enter your first name" /></td>
                    <td><h:message for="fname" style="color:red" /></td>
                </tr>
                <tr>
                    <td><h:outputText value="Enter Your Last Name:" /></td>
                    <td><h:inputText id="lname" value="#{user.lastName}"
                            required="true" requiredMessage="Please enter your last name" /></td>
                    <td><h:message for="lname" style="color:red" /></td>
                </tr>
                <tr>
                    <td><h:outputText value="Enter Your email ID:" /></td>
                    <td><h:inputText id="email" value="#{user.email}"
                            required="true" requiredMessage="Please enter your email id" /></td>
                    <td><h:message for="email" style="color:red" /></td>
                </tr>
                <tr>
                    <td><h:outputText value="Enter Password :" /></td>
                    <td><h:inputSecret id="psw" value="#{user.password}"
                            required="true" requiredMessage="Please enter your password" /></td>
                    <td><h:message for="psw" style="color:red" /></td>
                </tr>
                <tr>
                    <td />
                    <td><h:commandButton value="Register" action="#{user.add}" /></td>
                </tr>
                <tr>
                    <td><h:outputLink value="home.xhtml">Home</h:outputLink></td>
                </tr>
            </table>
        </h:form>
    </f:view>
</h:body>
</html>


success.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core">

<h:head>
    <title>Success Page</title>
</h:head>
<h:body>
    <f:view>
        <p>Successfully logged in</p>
        <p>Hi, #{user.firstName}</p>
        <h:form>
            <p>
                <h:commandLink value="logout" action="#{user.logout}" />
            </p>
        </h:form>
    </f:view>
</h:body>
</html>


unsuccess.xhtml

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core">
<h:head>
    <title>Unsuccess Page</title>
</h:head>
<h:body>
    <f:view>
        <p>There is an error in signing up. See Server Console for error.</p>
        <h:outputLink value="register.xhtml">Back</h:outputLink>
    </f:view>
</h:body>
</html>


Now, the frontend is almost completed so, lets create a java class which will have some of the required fields and methods which will enable us to insert the data into the database and validate the data for the login functionality.

User.java

package com.amzi.beans;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
import javax.faces.context.FacesContext;
import javax.naming.Context;
import javax.naming.InitialContext;
import javax.naming.NamingException;
import javax.sql.DataSource;

@ManagedBean(name = "user")
@RequestScoped
public class User {

    private String firstName;
    private String lastName;
    private String email;
    private String password;
    private String dbPassword;
    private String dbName;
    DataSource ds;

    public User() {
        try {
            Context ctx = new InitialContext();
            ds = (DataSource) ctx.lookup("java:comp/env/jdbc/database");
        } catch (NamingException e) {
            e.printStackTrace();
        }
    }

    public String getDbPassword() {
        return dbPassword;
    }

    public String getDbName() {
        return dbName;
    }

    public String getFirstName() {
        return firstName;
    }

    public void setFirstName(String name) {
        this.firstName = name;
    }

    public String getLastName() {
        return lastName;
    }

    public void setLastName(String lastName) {
        this.lastName = lastName;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    public String add() {
        int i = 0;
        if (firstName != null) {
            PreparedStatement ps = null;
            Connection con = null;
            try {
                if (ds != null) {
                    con = ds.getConnection();
                    if (con != null) {
                        String sql = "INSERT INTO user(firstname, password, lastname, email) VALUES(?,?,?,?)";
                        ps = con.prepareStatement(sql);
                        ps.setString(1, firstName);
                        ps.setString(2, password);
                        ps.setString(3, lastName);
                        ps.setString(4, email);
                        i = ps.executeUpdate();
                        System.out.println("Data Added Successfully");
                    }
                }
            } catch (Exception e) {
                System.out.println(e);
            } finally {
                try {
                    con.close();
                    ps.close();
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
        }
        if (i > 0) {
            return "success";
        } else
            return "unsuccess";
    }

    public void dbData(String uName) {
        if (uName != null) {
            PreparedStatement ps = null;
            Connection con = null;
            ResultSet rs = null;

            if (ds != null) {
                try {
                    con = ds.getConnection();
                    if (con != null) {
                        String sql = "select firstname,password from user where firstname = '"
                                + uName + "'";
                        ps = con.prepareStatement(sql);
                        rs = ps.executeQuery();
                        rs.next();
                        dbName = rs.getString("firstname");
                        dbPassword = rs.getString("password");
                    }
                } catch (SQLException sqle) {
                    sqle.printStackTrace();
                }
            }
        }
    }

    public String login() {
        dbData(firstName);
        if (firstName.equals(dbName) && password.equals(dbPassword)) {
            return "output";
        } else
            return "invalid";
    }

    public void logout() {
        FacesContext.getCurrentInstance().getExternalContext()
                .invalidateSession();
        FacesContext.getCurrentInstance()
                .getApplication().getNavigationHandler()
                .handleNavigation(FacesContext.getCurrentInstance(), null, "/login.xhtml");
    }
}


In the resources folder we can create the application.properties file just for the demonstration purposes.

application.properties

# -- welcome --
welcomeTitle=JSF Application

welcomeHeading=Welcome to my Blog!

welcomeMessage=This is a JSF application. You can find the application.properties file with this message in the src/resources folder.


Now, since this is JSF based application so, we are creating faces-config.xml file. This xml file will contain the navigation rule, message bundle configuration etc.

faces-config.xml

<?xml version="1.0" encoding="UTF-8"?>

<faces-config 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-facesconfig_2_0.xsd"
    version="2.0">
    <application>
        <message-bundle>resources.application</message-bundle>
        <locale-config>
            <default-locale>en</default-locale>
        </locale-config>
    </application>
    <navigation-rule>
        <description>login user</description>
        <from-view-id>/login.xhtml</from-view-id>
        <navigation-case>
            <from-action>#{user.login}</from-action>
            <from-outcome>output</from-outcome>
            <to-view-id>/success.xhtml</to-view-id>
        </navigation-case>

        <navigation-case>
            <from-action>#{user.login}</from-action>
            <from-outcome>invalid</from-outcome>
            <to-view-id>/error.xhtml</to-view-id>
        </navigation-case>
    </navigation-rule>

    <navigation-rule>
        <description>register new user</description>
        <from-view-id>/register.xhtml</from-view-id>
        <navigation-case>
            <from-action>#{user.add}</from-action>
            <from-outcome>success</from-outcome>
            <to-view-id>/success.xhtml</to-view-id>
        </navigation-case>
        <navigation-case>
            <from-action>#{user.add}</from-action>
            <from-outcome>unsuccess</from-outcome>
            <to-view-id>/unsuccess.xhtml</to-view-id>
        </navigation-case>
    </navigation-rule>
</faces-config>


And, finally we are going to create the web.xml file

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
    id="WebApp_ID" version="3.0">
    <display-name>jsfLoginExample</display-name>
    <welcome-file-list>
        <welcome-file>/home.xhtml</welcome-file>
    </welcome-file-list>
    <resource-ref>
        <description>Login Database</description>
        <res-ref-name>jdbc/database</res-ref-name>
        <res-type>javax.sql.DataSource</res-type>
        <res-auth>Container</res-auth>
    </resource-ref>
    <servlet>
        <servlet-name>Faces Servlet</servlet-name>
        <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>/faces/*</url-pattern>
        <url-pattern>*.jsf</url-pattern>
        <url-pattern>*.xhtml</url-pattern>
        <url-pattern>*.jsp</url-pattern>
    </servlet-mapping>
    <context-param>
        <description>State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2</description>
        <param-name>javax.faces.STATE_SAVING_METHOD</param-name>
        <param-value>client</param-value>
    </context-param>
    <context-param>
        <param-name>javax.servlet.jsp.jstl.fmt.localizationContext</param-name>
        <param-value>resources.application</param-value>
    </context-param>
    <listener>
        <listener-class>com.sun.faces.config.ConfigureListener</listener-class>
    </listener>
    <servlet-mapping>
        <servlet-name>Faces Servlet</servlet-name>
        <url-pattern>*.faces</url-pattern>
    </servlet-mapping>
</web-app>


Now, we are all set to deploy our application onto the tomcat server. And, once we deploy our project the application should redirect to home.xhtml

So, first of all lets check to see if the the sign up link is working correctly.




Clicking on logout link will redirect the page to the login page.


Now, we are going to register with the duplicate primary key and see what happens.





 Also, we can verify the index page by hitting this URL


Download the complete source code.


Upload image file into database using java servlet, jdbc and mysql

In this example we are going to create a project which will enable users to upload the image into the database.
First of all turn on mysql database connection and open the mysql command line and paste the following sql script and create the new database as well as table.

create database AppDB;

use AppDB;

CREATE TABLE `contacts` (
  `contact_id` int(11) NOT NULL AUTO_INCREMENT,
  `first_name` varchar(45) DEFAULT NULL,
  `last_name` varchar(45) DEFAULT NULL,
  `photo` mediumblob,
  PRIMARY KEY (`contact_id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1


Now, lets create a dynamic web project into the eclipse and design the structure as follows:



Now, let's create the front end using the jsp pages.
uploadImage.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>File Upload</title>
</head>
<body>
    <h1>Upload any image to mysql DB</h1>
    <form method="post" action="fileUpload"
        enctype="multipart/form-data">
        <table>
            <tr>
                <td>First Name:</td>
                <td><input type="text" name="firstName" size="10"
                    required="required" /></td>
            </tr>
            <tr>
                <td>Last Name:</td>
                <td><input type="text" name="lastName" size="10"
                    required="required" /></td>
            </tr>
            <tr>
                <td>Choose Image:</td>
                <td><input type="file" name="photo" size="10"
                    required="required" /></td>
            </tr>
            <tr>
                <td><input type="submit" value="Submit"></td>
                <td><input type="reset" value="Clear" /></td>
            </tr>
        </table>
    </form>
</body>
</html>


submit.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Success</title>
</head>
<body>
    <h3><%=request.getAttribute("Message")%></h3>
</body>
</html>


db.properties

driver=com.mysql.jdbc.Driver
url=jdbc:mysql://localhost:3306/AppDB
user=root
password=password 


DbUtil.java

package com.amzi.util;

import java.io.FileNotFoundException;
import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;
import java.util.Properties;

public class DbUtil {

    private static Connection connection = null;

    public static Connection getConnection() {
        if (connection != null)
            return connection;
        else {
            try {
                Properties prop = new Properties();
                InputStream inputStream = DbUtil.class.getClassLoader().getResourceAsStream("/db.properties");
                prop.load(inputStream);
                String driver = prop.getProperty("driver");
                String url = prop.getProperty("url");
                String user = prop.getProperty("user");
                String password = prop.getProperty("password");
                Class.forName(driver);
                connection = DriverManager.getConnection(url, user, password);
            } catch (ClassNotFoundException e) {
                e.printStackTrace();
            } catch (SQLException e) {
                e.printStackTrace();
            } catch (FileNotFoundException e) {
                e.printStackTrace();
            } catch (IOException e) {
                e.printStackTrace();
            }
            return connection;
        }

    }
}


UploadServlet.java

package com.amzi.servlet;

import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.SQLException;

import javax.servlet.ServletException;
import javax.servlet.annotation.MultipartConfig;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.Part;

import com.amzi.util.DbUtil;

@WebServlet("/fileUpload")
@MultipartConfig(maxFileSize = 16177215) // upload file up to 16MB
public class UploadServlet extends HttpServlet {

    private static final long serialVersionUID = -1623656324694499109L;
    private Connection conn;

    public UploadServlet() {
        conn = DbUtil.getConnection();
    }

    protected void doPost(HttpServletRequest request,
            HttpServletResponse response) throws ServletException, IOException {
        
        // gets values of text fields
        String firstName = request.getParameter("firstName");
        String lastName = request.getParameter("lastName");

        InputStream inputStream = null;

        // obtains the upload file part in this multipart request
        Part filePart = request.getPart("photo");
        if (filePart != null) {
            // debug messages
            System.out.println(filePart.getName());
            System.out.println(filePart.getSize());
            System.out.println(filePart.getContentType());

            // obtains input stream of the upload file
            inputStream = filePart.getInputStream();
        }

        String message = null; // message will be sent back to client

        try {
            // constructs SQL statement
            String sql = "INSERT INTO contacts (first_name, last_name, photo) values (?, ?, ?)";
            PreparedStatement statement = conn.prepareStatement(sql);
            statement.setString(1, firstName);
            statement.setString(2, lastName);

            if (inputStream != null) {
                // fetches input stream of the upload file for the blob column
                statement.setBlob(3, inputStream);
            }

            // sends the statement to the database server
            int row = statement.executeUpdate();
            if (row > 0) {
                message = "Image is uploaded successfully into the Database";
            }
        } catch (SQLException ex) {
            message = "ERROR: " + ex.getMessage();
            ex.printStackTrace();
        }
        // sets the message in request scope
        request.setAttribute("Message", message);

        // forwards to the message page
        getServletContext().getRequestDispatcher("/submit.jsp").forward(
                request, response);
    }
}


Now, we are ready to run the project and once we run the project we are able to view the following result.





Click here to download the code.

You may also like...

Check username availability using Java, JSP, AJAX, MySQL, JDBC, Servlet

Login application using jsp servlet and mysql database

JSF login and register application

 

 

How to connect to Oracle database from java code - JDBC

In this example we are going to connect to the Oracle database.

Pre-requisite:

  1. We need Oracle database up and running.
  2. Oracle JDBC driver
  3. Eclipse IDE (Recommended but not required)
Download oracle jdbc driver from here

If you are working on IDE then create a java project and add the oracle jdbc driver to the build path. And your project structure should look something like this



Now, we are going to write the core logic in order to connect to the oracle database.

package com.amzi.database;

import java.sql.DriverManager;
import java.sql.Connection;
import java.sql.SQLException;

public class ConnectOracle {

    public static void main(String[] amzi) {
       
        System.out.println("-------- Oracle JDBC Connection Testing ------");
        try {
            Class.forName("oracle.jdbc.driver.OracleDriver");
        } catch (ClassNotFoundException e) {
            System.out.println("Oracle JDBC Driver not found!!!");
            e.printStackTrace();
            return;
        }

        System.out.println("Oracle JDBC Driver Registered!");
        Connection connection = null;
        try {
            connection = DriverManager
                    .getConnection(
                            "jdbc:oracle:thin:@localhost:1521:xe",
                            "yourUsername", "yourPassword");
        } catch (SQLException e) {
            System.out.println("Connection Failed!!!");
            e.printStackTrace();
            return;

        }

        if (connection != null) {
            System.out.println("Connection established successfully!");
        } else {
            System.out.println("Connection is null!");
        }
    }
}


If everything goes fine, you should see your console as below.

-------- Oracle JDBC Connection Testing ------
Oracle JDBC Driver Registered!
Connection established successfully!

Check username availability using Java, JSP, AJAX, MySQL, JDBC, Servlet


Hey guys, today we are gonna be developing the username availability application based on the real world scenario and using the technologies which are used across almost all the major IT firms.

Before we begin writing the code I'd assume that you guys have following software installed.

  1. Eclipse IDE
  2. Tomcat app server
  3. MySQL Database


Alright, first of all we are going to start the DB and will create the database and the table. After that we can enter some test values. Check the script below.
MySQL Script:
create database students;

create table users(
 uid int primary key 
        auto_increment,
 uname varchar(20) unique
 );

INSERT INTO `students`.`users` 
(`uid`, `uname`) VALUES ('1', 
'Amjad');INSERT INTO 
`students`.`users` (`uid`, 
`uname`) VALUES ('2', 'Amzi');


Create a dynamic web project in your IDE workspace and the project structure should look something like this.

Next are going to create the view using jsp, the view will consist of a simple text box which will check if the input string value is 3 character long or not. If yes then it will go ahead and make a query and will check the availability of the username.

index.jsp


Username Availability


 


 
 


Now, we are going to write a servlet which will create a database connection and make a query to it.
CheckAvailability.java
package com.amzi.servlets;

import java.io.*;
import java.sql.*;
import javax.servlet.ServletException;
import javax.servlet.http.*;

public class CheckAvailability extends HttpServlet {

 private static final long serialVersionUID = -734503860925086969L;

 protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        response.setContentType("text/html;charset=UTF-8");
        PrintWriter out = response.getWriter();
        try {

            String connectionURL = "jdbc:mysql://localhost:3306/students"; // students is my database name
            Connection connection = null;
            Class.forName("com.mysql.jdbc.Driver").newInstance();
            connection = DriverManager.getConnection(connectionURL, "root", "password");
            String uname = request.getParameter("uname");
            PreparedStatement ps = connection.prepareStatement("select uname from users where uname=?");
            ps.setString(1,uname);
            ResultSet rs = ps.executeQuery();
             
            if (!rs.next()) {
                out.println(""+uname+" is avaliable");
            }
            else{
            out.println(""+uname+" is already in use");
            }
            out.println();

        } catch (Exception ex) {
            out.println("Error ->" + ex.getMessage());
        } finally {
            out.close();
        }
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doPost(request, response);
    }
}


Also, we can configure the deployment descriptor as follows.
web.xml


    
        check
        com.amzi.servlets.CheckAvailability
    
    
        check
        /check
    
    
        
            30
        
    
    
        index.jsp
        
    


Note: In addition to these code we also need jquery library and mysql connector jar file. Just in case you are unable to find those, you may click here to get the complete source code.

Now, we are all set to deploy and test the code on the server. We can hit the below url
http://localhost:8080/UserAvailability/
And, the page will look something like this