JSP Beginner : Dynamic ComboBox

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • robtyketto
    New Member
    • Nov 2006
    • 108
    #1

    JSP Beginner : Dynamic ComboBox

    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. reload form or use an onchange even (I need some advice and guidance with these plase)?

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

    Any help would be appreciated.

    Code:
    <!-- 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>
<% }
//response.sendRedirect("wk465682UserMenu.jsp");
//
%>
</SELECT>
</FORM>
</HTML>

    Thanks and hope this makes sense
    Rob
    Tags: None
    • robtyketto
      New Member
      • Nov 2006
      • 108
      #2
      Im looking into the onchange function now, is this the right direction to go into?

        Comment

        • acoder
          Recognized Expert MVP
          • Nov 2006
          • 16032
          #3
          You said you want to avoid arrays. In that case, you have two options. Either refresh the page onchange with the new options, or use Ajax to get the new options to populate the second combo box.

            Comment

            • robtyketto
              New Member
              • Nov 2006
              • 108
              #4
              Can you expand on how to refresh the page onchange with the new options please?

              Cheers
              Rob

                Comment

                • acoder
                  Recognized Expert MVP
                  • Nov 2006
                  • 16032
                  #5
                  Change the location.href to point to the same page but with the option, e.g. onchange="locat ion.href='index .jsp?opt='+this .value". Then you could check for opt using JSP and use that to populate the combo box.

                    Comment

                    • robtyketto
                      New Member
                      • Nov 2006
                      • 108
                      #6
                      Thanks for your help (Apologies if my response seems slightly retarted).
                      Im also googling other example to get a better understand of whats goin on.

                      I modified my code (see below)
                      When the value in the dropdown box is changed it reload the jsp and I expected the url to include the value of the option selected:-

                      This
                      http://localhost:8080/examples/wk465682UserMen u.jsp?.option=F TP
                      (Value of combo box)

                      Not this
                      http://localhost:8080/examples/wk465682UserMen u.jsp?.option=

                      I Shouldnt expect this to auto populate the option value on reload should I?
                      As I believe the SQL will retrieve the values in the combo box and ignore its last value before change.

                      Code:
                      <SELECT NAME="Category" id= Category onChange="location.href='wk465682UserMenu.jsp?.option='+this.value;">
<%
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" );%>
<OPTION VALUE='nochoice'>Please choose a category</OPTION>";
<%while(rs.next()) {
CategoryCombo = rs.getString("Category");%> 
<OPTION><%out.println(CategoryCombo);%>
</OPTION>
<% } %>

                        Comment

                        • acoder
                          Recognized Expert MVP
                          • Nov 2006
                          • 16032
                          #7
                          The option tags should have value attributes.

                          Remove the dot after jsp?, i.e. make it "...jsp?option= this.value".

                          In the JSP, check if the option value is set. If it isn't, display the default options. If it is, display the first combo box as normal (with the selected option set) and populate the second combo box using the passed option.

                            Comment

                            Previous template Next
                            Working...