Ajax jQuery Auto Fill Dropdown

Education is not limited to just classrooms. It can be gained anytime, anywhere... - Ravi Ranjan (M.Tech-NIT)

Ajax,jQuery Auto Fill Dropdown On Page Load

 

Let us see the auto fill drop downs using Ajax and jQuery

Files Required

  • index.html
  • db_fetch.jsp
  • jquery-1.2.6.js (Add this jquery file at db_fetch.jsp location, same  folder)
  • web.xml

Index.html

Notes: See line number 6 in index.html ,$(document).ready(function() means we no need to send any request like onchange or onclick, once the page loads automatically the code in this $(document).ready(function() block will be executed, so indirectly we are calling this function on page load hope you are clear.

db_fetch.jsp

<%@ page import="java.io.*,java.sql.*" %>
<%@ page contentType="text/html" pageEncoding="UTF-8"%>
 
<%
            response.setContentType("text/xml");        
 
                    Class.forName("oracle.jdbc.driver.OracleDriver");
                    Connection con =DriverManager.getConnection("jdbc:oracle:thin:@www.java4s.com:1521:XE","system","admin");
                    Statement st=con.createStatement();
                    ResultSet rs = st.executeQuery("select empname from emp");
 
                    out.println("<emp>");
                    while(rs.next())
                    {                            
                        out.println("<empname>"+rs.getString(1)+"</empname>");
 
                    }
                    out.println("</emp>");
 
rs.close();
st.close();
con.close();
 
%>

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_2_5.xsd" id="WebApp_ID" version="2.5">
 
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
</web-app>

OutPut

Note: you must have classes12.jar, ojdbc14.jar in the lib folder of you application

Database

Check Output

Click here to check the output