JSP Dependent Drop Down Menu
Hey Guy/Gals!
I need someone help to guide me in creating a drop down menu, where the first menu affects the second menu and it's selection. So in my database I have a category table that has a ID, parentID, and name. parentID is a FK to the PK ID within the same table. Can anyone please give me guidance or some links that may help me. I have been searching the interwebs for the past hour so I don't know how useful links will be to me, since I have literally searched everything. But any help would be nice.
I am guessing I will need to use JSP + AJAX to make this dynamic. Can anyone please help me soon?
<%@ page import="java.io.*,java.util.*,java.sql.*"%>
<%@ page import="javax.servlet.http.*,javax.servlet.*" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql"%>
<html>
<head>
<title>SELECT Operation</title>
</head>
<body>
<sql:setDataSource var="snapshot" driver="com.mysql.jdbc.Driver"
url="jdbc:mysql://uml.cs.uga.edu:3306/team6"
user="team6" password="overload"/>
<sql:query dataSource="${snapshot}" var="result">
SELECT * FROM Category WHERE parentID IS NULL;
</sql:query>
<select>
<c:forEach var="row" items="${result.rows}">
<option value="${row.id}" id="parent_id">${row.name}</option>
</c:forEach>
</select>
<select>
<c:forEach var="row" items="${result.rows}">
<option value="${row.id}" id="parent_id">${row.name}</option>
</c:forEach>
</select>
</body>
</html>
How Category is setup (NOT THE EXACT SCRIPT):
CREATE TABLE Category
CREATE TABLE 'Category'(
'ID' int(11) , NOT NULL, auto_increment,
'parentID', int(111),
'name', varchar(255), NOT NULL,
PRIMARY KEY ('id')
);
Also 'parentID' is a FK to the PK 'ID'.
Thanks ahead of time for any help!
View Answers
December 3, 2012 at 5:14 PM
The given code will help you to create a 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
Related Tutorials/Questions & Answers:
JSP Dependent Drop Down Menu
JSP Dependent Drop Down Menu Hey Guy/Gals!
I need someone help to guide me in creating a
drop down menu, where the first
menu affects the second
menu and it's selection. So in my database I have a category table that has a ID
Dependent drop down list
Dependent drop down list hi,i am trying to design a form on which 2
dependent drop down list is used my code is successful but when i select class from first
drop down list all the data get lossed means the value entered
Advertisements
Drop down menu
Drop down menu I have created a
drop down list of links which links to a table but if i click the link the table display in the other page i want to display it in the same page.Please tell me the solution
Drop down menu
Drop down menu I have
drop down list of some 14 links which links to the table,If i click each link the table should display below the link and again if i click the link the table should not appear. please help me
html menu button drop down
html
menu button
drop down How to create a
menu button in HTML?
<select id="category">
<option value="1">One</option>
<option value="2">Two</option>
</select>
<select id
How to create a dependent drop down list using [Apache POI]
How to create a
dependent drop down list using [Apache POI] Here I..., and "rice, curd, milk" items will appear in the
dependent drop down list in cell.... In that two
drop down list are there. Want to create a
drop down list that depends
How to create a dependent drop down list using [Apache POI]
How to create a
dependent drop down list using [Apache POI] Here I..., and "rice, curd, milk" items will appear in the
dependent drop down list in cell.... In that two
drop down list are there. Want to create a
drop down list that depends
jQuery Drop Down Menu
jQuery
Drop Down Menu
In this JQuery tutorial we will develop a
program to make
Drop Down menu
Steps to develop the
Drop Down menu .
Step 1:
Create
want to insert values in drop down menu in struts1.3
want to insert values in
drop down menu in struts1.3 I am using DynaValidatorForm.please help me with inserting values in color
drop down menu. I...;
<
jsp:root xmlns:
jsp="http://java.sun.com/
JSP/Page"
xmlns:fmt="http
Drop-down text selection in jsp/html
Drop-
down text selection in
jsp/html Hi,
I am trying to create
JSP page where I have two
drop-downs. There are two-sets of data - First set....
Now the first dropdown will have all the values. The second
drop-
down depends upon
dynamic drop down list
dynamic
drop down list I want to create 2
drop down list, where it takes value from database and the two list are
dependent..means if I select... on the value chosen from the previous. want code in javascript and
jsp,
Can you help
drop down
drop down how can i add data from choice/dropdown component of java awt to myaql table
Drop Down
Drop Down How to insert date into database using dropdown like facebook
drop down php mysql - PHP
drop down php mysql PHP Script required to show the similar
drop down item in each
menu without refreshing the page. Is it possible if yes how
Drop Down reload in IE
Drop Down reload in IE Hi i was using two
drop down box..One for Displaying date followed by another for Dispalying Month..If i Select/Change Month from the 2nd
drop down then the 1st
drop down ( which is date) automatically
Drop Down Box
Drop Down Box In a
Drop Down box I want to show the user All the Country In the World. And when he type A-z,then each of the type Show those country which start with those word. Like I For-India
Login With Drop Down
Login With
Drop Down Hi all,
I am doing a project using
JSP. My... a
drop down list consisting of Customs and Accounts. I have user accounts of both the departments.
Now, my intention is to select the department from the
drop down
jsp- database dependent dropdown list
jsp- database
dependent dropdown list i want 2 dropdown list
1- CLASS
2-SECTION
both are should come from database.
and if i select a class... respective to that class from database.
please help by providing the code in
jsp
dynamic drop down
into the designation
drop
down
(use
jsp+javascript+servlet)
reply soon
1...dynamic
drop down I have created 2
drop downs in jsp.1 for department and other
for its related designation.that means if I select a department
Ajax drop down and textbox
Ajax
drop down and textbox hie frnds I have a dropdown
menu in the 3 options(1,2,3) are there if i choose 1 then I should get 1 text box if i select...
menu consisting of options 1,2,3. When the user select any option from
Get values in drop down list
Get values in
drop down list Pls provide me
jsp code to get values in
drop down list from another table's field.
my project has customer... in
drop down box in front end..... pls provide me code.. thanx
Drop down combos
Drop down combos Hi..
How to write a javascript for linked combo dropdown boxes.
<html>
<h2>ComboBox</h2>
<script language="javascript">
var arr = new Array();
arr[0] = new Array("-select