Ads
Hi Guys, In need of some help, so i have three combo boxes, the first is supplier, the second range and the final model
so what should happen is the user selects the first combo box which will then load the next combo box values,
now i know how to populate the first one, and then how to send the data off to a servlet and preform a search on the database for the values I want, but then how do I pass that back to the client using ajax, and then populate the combo box, I must'nt reload the page!
any help would be greatly appreciated!!!
1)country.jsp:
Share on Google+<%@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="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
}
}
</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
Ads