how to get drop down populated dynamically
Hi Friend,
Create table country(country_id,country) in database and try the following code:
<%@page import="java.sql.*"%> <html> <form name="form" method="post" > <b>Select a country:</b> </td> <select name="sel"><option value=""><---Select---></option> <% Class.forName("com.mysql.jdbc.Driver").newInstance(); String connectionURL = "jdbc:mysql://localhost:3306/test"; Connection connection= DriverManager.getConnection(connectionURL, "root", "root"); PreparedStatement psmnt = connection.prepareStatement("select * from country "); ResultSet results = psmnt.executeQuery(); while(results.next()){ String name = results.getString(2); String id = results.getString(1); %><option value="<%= name %>"><%=name%></option> <%} results.close(); psmnt.close(); %> </select><br> </form>
Thanks
Hi Friend,
If you want the code in ajax then try the following code:
1)country.jsp:
<%@page import="java.sql.*"%> <html> <head> <script language="javascript" type="text/javascript"> var xmlHttp var xmlHttp function showState(str){ if (typeof XMLHttpRequest != "undefined"){ xmlHttp= new XMLHttpRequest(); } else if (window.ActiveXObject){ xmlHttp= new ActiveXObject("Microsoft.XMLHTTP"); } if (xmlHttp==null){ alert ("Browser does not support XMLHTTP Request") return } var url= "city.jsp"; url += "?count=" +str; xmlHttp.onreadystatechange = stateChange; xmlHttp.open("GET", url, true); xmlHttp.send(null); } function stateChange(){ if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ document.getElementById("state").innerHTML=xmlHttp.responseText } } </script> </head> <body> <select name='country' onchange="showState(this.value)"> <option value="none">Select</option> <% Class.forName("com.mysql.jdbc.Driver").newInstance(); Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/test","root","root"); Statement stmt = con.createStatement(); ResultSet rs = stmt.executeQuery("Select * from country"); while(rs.next()){ %> <option value="<%=rs.getString(1)%>"><%=rs.getString(2)%></option> <% } %> </select> <br> <div id='state'> <select name='state' > <option value='-1'></option> </select> </div> </body> </html>
2)city.jsp:
<%@page language="java" import ="java.sql.*" %> <% String country=request.getParameter("count"); String buffer="<select name='state'><option value='-1'>Select</option>"; Class.forName("com.mysql.jdbc.Driver").newInstance(); Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/test","root","root"); Statement stmt = con.createStatement(); ResultSet rs = stmt.executeQuery("Select * from city where countryid='"+country+"' "); while(rs.next()){ buffer=buffer+"<option value='"+rs.getString(2)+"'>"+rs.getString(3)+"</option>"; } buffer=buffer+"</select>"; response.getWriter().println(buffer); %>
We have used following database tables:
1)country
CREATE TABLE country
(
countryid
bigint(30) NOT NULL auto_increment,
countryname
varchar(40) default NULL,
PRIMARY KEY (countryid
)
)
2)city
CREATE TABLE city
(
id
bigint(40) NOT NULL auto_increment,
countryid
int(100) default NULL,
city
varchar(40) default NULL,
PRIMARY KEY (id
)
)
The above code populate the second dropdown on selecting the value from the first dropdown.
Thanks
Ads