How to get sub category based on category from database using jsp and javascript?
Here is a jsp code that generates dependent dropdown box.
1)country.jsp:
<%@page import="java.sql.*"%> <html> <head> <script language="javascript" type="text/javascript"> var xmlHttp var xmlHttp function showState(str){ xmlHttp=GetXmlHttpObject(); if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return } var url="state.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 } } function GetXmlHttpObject() { var xmlHttp=null; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) { //Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; } </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)state.jsp:
<%@page import="java.sql.*"%> <% String country=request.getParameter("count"); String buffer="<select name='state' ><option value='-1'>Select</option>"; try{ 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 state where countryid='"+country+"' "); while(rs.next()){ buffer=buffer+"<option value='"+rs.getString(1)+"'>"+rs.getString(3)+"</option>"; } buffer=buffer+"</select>"; response.getWriter().println(buffer); } catch(Exception e){ System.out.println(e); } %>
For the above code, we have created two database tables:
CREATE TABLE `country` ( `countryid` bigint(255) NOT NULL auto_increment, `countryname` varchar(255) default NULL, PRIMARY KEY (`countryid`)); CREATE TABLE `state` ( `stateid` bigint(255) NOT NULL auto_increment, `countryid` int(255) default NULL, `state` varchar(255) default NULL, PRIMARY KEY (`stateid`));
Ads