Cheap VPS & Xen Server


Residential Proxy Network - Hourly & Monthly Packages

Search Example


In this example, we are creating a form to search employee by name using ajax in java. Here, we have written the two-tier application code, to make the application easy to understand. You can write the database code, according to your standard.

Steps to create search example using AJAX in Java

You need to follow following steps:

  1. Create table in database
  2. load the org.json.jar file
  3. Create input form
  4. Create server side page to search employee using name

Create table in database

In this example, we are using oracle 10g database. Here, we have created a table “emp911” which has following data.

searchajaxtable

Load the org.json.jar file

download this example, we have included the org.json.jar file inside the WEB-INF/lib directory.


Create input form

In this page, we have created a form that gets input from the user to search employee by name. When user releases the key after pressing through keyboard, searchInfo() function is called. The ajax code is written inside searchInfo() function.

index.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <script>
  5. var request=new XMLHttpRequest();
  6. function searchInfo(){
  7. var name=document.vinform.name.value;
  8. var url=“index.jsp?val=”+name;
  9. try{
  10. request.onreadystatechange=function(){
  11. if(request.readyState==4){
  12. var val=request.responseText;
  13. document.getElementById(‘mylocation’).innerHTML=val;
  14. }
  15. }//end of function
  16. request.open(“GET”,url,true);
  17. request.send();
  18. }catch(e){alert(“Unable to connect to server”);}
  19. }
  20. </script>
  21. </head>
  22. <body>
  23. <h1>Search Employee</h1>
  24. <form name=“vinform”>
  25. <input type=“text” name=“name” onkeyup=“searchInfo()”>
  26. </form>
  27. <span id=“mylocation”></span>
  28. </body>
  29. </html>

Create server side page to process the request

In this jsp page, we are writing the database code to search employee starting with given name.

index.jsp

  1. <%@ page import=“java.sql.*” %>
  2. <%
  3. String name=request.getParameter(“val”);
  4. if(name==null||name.trim().equals(“”)){
  5. out.print(“<p>Please enter name!</p>“);
  6. }else{
  7. try{
  8. Class.forName(“oracle.jdbc.driver.OracleDriver”);
  9. Connection con=DriverManager.getConnection(“jdbc:oracle:thin:@localhost:1521:xe”,”system”,”oracle”);
  10. PreparedStatement ps=con.prepareStatement(“select * from emp911 where name like ‘”+name+”%'”);
  11. ResultSet rs=ps.executeQuery();
  12. if(!rs.isBeforeFirst()) {
  13.  out.println(“<p>No Record Found!</p>“);
  14. }else{
  15. out.print(“<table border=‘1’ cellpadding=‘2’ width=‘100%’>“);
  16. out.print(“<tr><th>Id</th><th>Name</th><th>Email</th>
  17. <th>Address</th><th>City</th><th>State</th><th>Country</th></tr>“);
  18. while(rs.next()){
  19. out.print(“<tr><td>“+rs.getString(1)+”</td><td>“+rs.getString(2)+”</td><td>“+rs.getString(3)+”</td>
  20. <td>“+rs.getString(4)+”</td><td>“+rs.getString(5)+”</td><td>“+rs.getString(6)+”</td>
  21. <td>“+rs.getString(7)+”</td></tr>“);
  22. }
  23. out.print(“</table>“);
  24. }//end of else for rs.isBeforeFirst
  25. con.close();
  26. }catch(Exception e){out.print(e);}
  27. }//end of else
  28. %>

Download this ajax example

Output

See the search form.

searchajax1

Now enter employee name. If employee name is not found, it will display “No record found!” message

searchajax2

Now enter employee name that exists in the table. Now it will display all records starting with given name.

searchajax3

Comments

comments