Begginer: JSP Cascading Comb box.

Greetings,

Im a newbie to JSP/Javascript (unfortunalley).

However I found enough example to create code that connects to my access db and populates two combo boxes.

The selection of the first box is used to populate the second (cascading).
See code below, apologies for the formatting as I wrote it in notepad.

I am assuming the code runs through once and therefor combo box populated only once.
How can I make them dynamic, needing some how to perhaps include a loop?

Preferrably without the use of arrays and with a simple structure as below, so I can understand it.

<!-- the % tag below is what is called a scriptlet tag - allows java to be embedded in the jsp -->
<%@ page import="java.util.*" %>
<%@ page language="java" %>
<%@ page import="java.sql.*" %>
<HTML>
<H1>FAQ</H1>

<H3>Please choose a category</H3>
<FORM ACTION="wk465682UserMenu.jsp" METHOD="POST">
<%
String CategoryCombo = null;%>
<SELECT NAME="Category" id = Category>
<%
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver").newInstance();
Connection conn = DriverManager.getConnection("jdbc:odbc:FAQ");
Statement statement = conn.createStatement();
ResultSet rs = statement.executeQuery("SELECT DISTINCT CATEGORY FROM FAQ" );
while(rs.next()) {
CategoryCombo = rs.getString("Category");%> 
<OPTION><%out.println(CategoryCombo);%>
</OPTION>
<% } %>
</SELECT>
<BR><BR>
<H3>Please choose a question</H3>
<%
String QuestionCombo = null;%>
<SELECT NAME="Question" id = Question>
<%ResultSet ss = statement.executeQuery("SELECT * FROM FAQ WHERE CATEGORY = ( '" + CategoryCombo + "')");
while(ss.next()) {
QuestionCombo = ss.getString("Question");%> 
<OPTION><%out.println(QuestionCombo);%>
</OPTION>
<% } %>
</SELECT>
</FORM>
</HTML>

Thanks and hope this makes sense
Rob

oopps Thats should be beginner not begginer in subject heading!

Robtyketto

Light Poster

36 posts since Mar 2007

Reputation Points: 10

Solved Threads: 0

4 Years Ago

Should I think about reloading the form or using an onchange event?

Robtyketto

Light Poster

36 posts since Mar 2007

Reputation Points: 10

Solved Threads: 0

4 Years Ago

Accessing the database from JSP which is meant for display / view purposes is a bad practice. Put all your database access code in a servlet which would then set the retrieved data in a session or request scoped variable which would then be accordingly rendered in the JSP file. Look into JSTL (JSP standard template library) for a clean demarcation between display and logic.

Coming to your problem at hand, one thing which you can do is to set the 'display' style property of the option element to none for the elements which you don't want to render. Something like:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta http-equiv="Expires" content="0" /> <!-- disable caching -->
    <title>Example</title>
</head>
<body>
    <form action="#" id="frm">
      <select name="selPrimary">
        <option value="one">1</option>
        <option value="two" style="display: none;">2</option>
        <option value="three">3</option>
      </select>
    </form>
</body>
</html>

The obvious disadvantage of this approach is that your site won't function when javascript is disabled since you would be needing its help for toggling the display style property of option elements.

You would attach an event handler to the onchange event listener of the primary select box. Based on it's value, you would iterate through the options of the secondary select box and make then visible / invisible based on some mapping which you would be having (populate second select box with 1.1, 1.2, 1.3 if the value selected in the first select box is 1 etc.). If all this seems confusing, you need to read up some good Javascript tutorials and things would start falling in place.

~s.o.s~

Failure as a human

Administrator

11,938 posts since Jun 2006

Reputation Points: 3,281

Solved Threads: 734

This article has been dead for over three months

You