?
Solved

jsp joined menu dropdowns - onChange or an array

Posted on 2003-03-26
12
Medium Priority
?
1,872 Views
Last Modified: 2012-08-14
hi
I've been tasked with changing the below code so that the menu boxes interact. They are task and subtasks (if the task has a subtask). It is a means to edit existing tasks - edit portion complete. I'm looking for a way to pull this info out of an Oracle db, first by task which has a dropdown and a "Go" to jump to that task to edit and also display any subtasks that may belong to the task, if any. The subtask needs a dropdown and "Go" button also. If there aren't any subtasks for the selected task, I need the subtask window not to be displayed.
As the tasks are pulled by dept id, there should not be that many entries and maybe an array (pulling all of the dept tasks and subtasks over at once) would be better than a onChange refresh when the task is selected. My SQL,jsp,java (everything I need to know:)) is very limited. Any advice would greatly be appreciated.

Currently this code shows all the tasks and subtasks from a particular DeptID in drop down menus without any correlation between the task and its subtask.

Please give as much code and explanations as possible.

thanks in advance for any assistance and guidance concerning this matter.

<body marginwidth="0" marginheight="0"  topmargin="10" leftmargin="10" bgcolor="#FFFFFF">

<%

      String _username = (String) session.getAttribute("user");
      String _deptid = (String)session.getAttribute("deptid");
      
      if (_username == null) {
            out.print("<script language=\"javascript\">");
            out.print("top.location.href = \"loginfail.jsp\";");
            out.print("</script>");
      }


//      String deptid = request.getParameter("deptid");

      String Dept = StatusSqlBean.returnDeptName(_deptid);
%>

<%
      String reqgroupproj[][] = StatusSqlBean.getGroupProjects(_deptid);
         String groupsubproj[][] = StatusSqlBean.getGroupSubProjects(_deptid);
         
%>
 
<div align="left"> </div>
<div align="left">
<form action="task_edit.jsp" method="post">
  <table border="0" width="565" cellspacing="0" cellpadding="0" height="20">
    <tr>
      <td width="1">
        <p align="right"><font size="3" face="Arial"></font>
      </td>
      <td><font size="2" face="Arial"><b>Status Central: </b>Edit Task - <%= Dept%></font></td>
    </tr>
    <tr><td><input type="hidden" name="department" value="<%= Dept%>"></td></tr>
    <tr>
      <td width="1" height="2">&nbsp;</td>
      <td height="19">
        <hr>
      </td>
    </tr>
    <tr>
      <td width="1" height="19">&nbsp;</td>
      <td height="19"><font face="Arial" size="2">Select Project to Edit:</font></td>
    </tr>
    <tr>
      <td width="1">&nbsp;</td>
      <td><font face="Arial" size="2">
        <select name="TSKID">

<%
      for (int i = 0; i < reqgroupproj.length; i++) {
%>

<option value="<%= reqgroupproj[i][0] %>"> <%= reqgroupproj[i][1] %> </option>

<%
      }
%>

        </select>
        </font></td>
    </tr>
    <tr>
      <td width="1">&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td width="1">&nbsp;</td>
      <td>
        <input type="submit" value="Submit" name="submit">
      </td>
    </tr>
   
   
  </table>
  </form>
</div>
<div align="left">
   
<br><br>

    <div align="left"> </div>
<div align="left">
<form action="task_edit.jsp" method="post">
<input type=hidden name=subtask value=y>
<input type=hidden name=master value=n>
  <table border="0" width="565" cellspacing="0" cellpadding="0" height="20">
    <tr>
      <td width="1">
        <p align="right"><font size="3" face="Arial"></font>
      </td>
      <td><font size="2" face="Arial"><b>Sub Tasks </b></font></td>
    </tr>
    <tr><td><input type="hidden" name="department" value="<%= Dept%>"></td></tr>
    <tr>
      <td width="1" height="2">&nbsp;</td>
      <td height="19">
        <hr>
      </td>
    </tr>
    <tr>
      <td width="1" height="19">&nbsp;</td>
      <td height="19"><font face="Arial" size="2">Select Sub Task to Edit:</font></td>
    </tr>
    <tr>
      <td width="1">&nbsp;</td>
      <td><font face="Arial" size="2">
        <select name="SUBID">
       

   <%
   

         
      for (int i = 0; i < groupsubproj.length; i++) {
      
   if (groupsubproj[i][2] != "") {
%>    

   

<option value="<%= groupsubproj[i][2] %>"> <%= groupsubproj[i][3] %> </option>


 
  <%
      } }
%>
 
          </select>
        </font></td>
    </tr>
    <tr>
      <td width="1">&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td width="1">&nbsp;</td>
      <td>
        <input type="submit" value="Submit" name="submit">
      </td>
    </tr>
 </table>
</div>
<div align="left">
</form>
 
 
</div>

</body>
</html>
0
Comment
Question by:bf109
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 5
12 Comments
 
LVL 14

Expert Comment

by:kennethxu
ID: 8215110
if you want to retrieve all tasks and subtasks only once from database, you'll need heavy javascript at browser side to handle this.

if you are ok to submit the page and run query again to retrieve subtasks based on what main task use picked. then jsp coding is enough.

let me know which approach you would like to take and I'll help you from there.
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8215336
anyway, this is heavy javascript sample code:

<%
// This part should from database, I hard code here to illustrate the idea.
String[][] select1 = {
     { "webmaster", "Webmaster sites" },
     { "news", "News sites" },
     { "entertainment", "Entertainment" }
};

String[][][] tmp = {
  {
     {"JavaScript Kit","http://javascriptkit.com"},
     {"Dynamic Drive","http://www.dynamicdrive.com"},
     {"Freewarejava.com","http://www.freewarejava.com"},
     {"Free Web Templates","http://www.freewebtemplates.com"},
     {"Web Monkey","http://www.webmonkey.com"}
  },
  {
     {"CNN","http://www.cnn.com"},
     {"MSNBC","http://www.msnbc.com"},
     {"BBC News","http://news.bbc.co.uk"},
     {"ABC News","http://www.abcnews.com"}
  },
  {
     {"Hollywood.com","http://www.hollywood.com"},
     {"MTV","http://www.mtv.com"},
     {"ETOnline","http://etonline.com"}
  }
};

java.util.Map map = new java.util.HashMap();
for( int i = 0; i < select1.length; i++ ) {
     map.put( select1[i][0], tmp[i] );
}

%>

<form name="dynamiccombo">
<select name="combo1" onChange="populate( this.options[this.selectedIndex].value )" >
     <% for( int i=0; i<select1.length; i++ ) { %>
     <option value="<%=select1[i][0]%>"><%=select1[i][1]%></option>
     <% } %>
</select>

<select name="combo2" size="1">
<option value="#">This is a Place Holder</option>
</select>
<input type="button" name="test" value="Go!"
onClick="gothere()">
</form>

<script>
<!--
<% // dynamically generate javascript arrays, view source to see the result.
    for( int i=0; i<select1.length; i++ ) {
%>
        var <%=select1[i][0]%>=new Array()
<%
            String[][] select2 = (String[][]) map.get( select1[i][0] );
            for( int j=0; j<select2.length; j++ ) {
%>
            <%=select1[i][0]%>[<%=j%>]=new Option("<%=select2[j][0]%>", "<%=select2[j][1]%>")
<%
        }
    }
%>

var oCombo2=document.dynamiccombo.combo2
var oCombo1=document.dynamiccombo.combo1

function populate(x){
     for (m=oCombo2.options.length-1;m>0;m--)
     oCombo2.options[m]=null
     selectedarray=eval(x)
     for (i=0;i<selectedarray.length;i++)
     oCombo2.options[i]=new Option(selectedarray[i].text,selectedarray[i].value)
     oCombo2.options[0].selected=true
}

function gothere(){
     location=oCombo2.options[oCombo2.selectedIndex].value
}

//SHOW first combo by default
populate( oCombo1.options[oCombo1.selectedIndex].value )

//-->
</script>

0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8215341
this is light javascript sample code:

<%@ page import="java.util.*"%>
<html>
<head>
<title>My Option Test</title>

<script language="JavaScript">
<!--
function getSelected( selectbox ) {
    for (i=0;i<selectbox.length;i++)
       if (selectbox.options[i].selected) return selectbox.options[i];
}

function update() {
     var action = "?box1="+escape( getSelected(form1.box1).text );
     location.replace(action);
}
//-->
</script>

</head>
<body>

<%
   Map opts = new HashMap();
   String[] sub;
   opts.put( "Choice1", new String[]{ "ChoiceA", "ChoiceB" } );
   opts.put( "Choice2", new String[]{ "ChoiceC", "ChoiceD" } );
%>
 

<form name="form1">
box1:<p>
<select name="box1" onchange="javascript:update()">
<%
   String sel = request.getParameter( "box1" );
   if( sel == null ) sel = "Choice1"; //default choice

    Iterator box1 = opts.keySet().iterator();
    while( box1.hasNext() ) {
          String option = (String) box1.next();
%>
<option <%=option.equals(sel)?"selected":""%>><%=option%></option>
<%
       }
%>
</select><p>

box2:<p>
<select name="box2">
<%
   String[] box2 = (String[])opts.get(sel);
   for( int ii = 0; ii < box2.length; ii++ ) {
%>
      <option><%=box2[ii]%></option>
<%  } %>
</select>


</body>
</html>
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 14

Expert Comment

by:kennethxu
ID: 8215346
let me know if you have further enquires.
0
 

Author Comment

by:bf109
ID: 8221591
kennethxu
thanks for the reply
the 1st code looks like it'll work with just one tweak..
I need the ability to hyperlink with a go box from the first menu box(task) as well as the second (subtask). Also if the first menu (task) selection does not have a corresponding second menu choice (subtask), it would be ideal if the second box (subtask) did not show at all..
thanks again
0
 

Author Comment

by:bf109
ID: 8228802
any other suggestions here?

basically need an array to hold the task & subtask info from database

to display this info as dropdown boxes with the subtask box being invisible if a task does not have a subtask. the subtask box to key off the task menu while both are able to directly hyperlink to pull up listed task/subtask to an edit screen.

would it help if I posted the bean info for reqgroupproj?

thanks for any help
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8229216
that's involves quite some coding, even if we write one for you, how are you going to maintain it?

i think it's better you start from one of the sample i gave to you. understand it and change according to your need.

when you hit specific problem. we are here to help.
0
 

Author Comment

by:bf109
ID: 8229301
thanks kennethxu
the support isn't an issue, I'm surround at work by developers half my age with 10x the skills in development :) Just trying to contribute something to this project. Seems I understand this best by playing with working examples than trying to write it from scratch. I'm a newbies newbie..:)
What about the if/else statement as it pertains to the task/subtask relationship as the visibility of the subtask window is concerned. Can you show me an example of this?
0
 

Author Comment

by:bf109
ID: 8229314
here is how the tasks/subtasks are currently being pulled from the oracle db through the bean:

public String[][] getGroupProjects(String deptid) {
        String[][] reqgroupproj = null;

        try {
            Connection con = DBPool.getConnection("statuscentral");

            if (con != null) {
                int row = 0;
                Statement stmt = con.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,
                        ResultSet.CONCUR_READ_ONLY);

                //                 String query = "select tskID, tskName from task where dptID =" + deptid + "ORDER BY tskname";
                String query =
                    "select tskID, tskName, dptid from task where dptid =" +
                    deptid + "  order by tskname";
                ResultSet rs = stmt.executeQuery(query);
                ResultSetMetaData rsmd = rs.getMetaData();
                int columnCount = rsmd.getColumnCount();
                rs.last();

                int rowCount = rs.getRow();
                reqgroupproj = new String[rowCount][columnCount];
                rs.beforeFirst();

                while (rs.next()) {
                    for (int i = 0; i < columnCount; i++) {
                        reqgroupproj[row][i] = rs.getString(i + 1);

                        if (reqgroupproj[row][i] == null) {
                            reqgroupproj[row][i] = "";
                        }
                    }

                    row++;
                }

                rs.close();
                stmt.close();
            }

            con.close();
        } catch (Exception e) {
            e.printStackTrace();
        }

        return reqgroupproj;
    }

    public String[][] getGroupSubProjects(String deptid) {
        String[][] groupsubproj = null;

        try {
            Connection con = DBPool.getConnection("statuscentral");

            if (con != null) {
                int row = 0;
                Statement stmt = con.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,
                        ResultSet.CONCUR_READ_ONLY);

                //                 String query = "select tskID, tskName from task where dptID =" + deptid + "ORDER BY tskname";
                String query =
                    "select task.tskID, task.dptid, subtask.subid, subtask.subname from task,subtask where task.tskid = subtask.tskid (+) and task.dptid =" +
                    deptid + "  order by subtask.subname";
                ResultSet rs = stmt.executeQuery(query);
                ResultSetMetaData rsmd = rs.getMetaData();
                int columnCount = rsmd.getColumnCount();
                rs.last();

                int rowCount = rs.getRow();
                groupsubproj = new String[rowCount][columnCount];
                rs.beforeFirst();

                while (rs.next()) {
                    for (int i = 0; i < columnCount; i++) {
                        groupsubproj[row][i] = rs.getString(i + 1);

                        if (groupsubproj[row][i] == null) {
                            groupsubproj[row][i] = "";
                        }
                    }

                    row++;
                }

                rs.close();
                stmt.close();
            }

            con.close();
        } catch (Exception e) {
            e.printStackTrace();
        }

        return groupsubproj;
    }

0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8236049
I'm sorry, I think everybody here has his/her own project to do. We cannot do entire project for you, the site is about guide and help.

I understand you are new to java, but everybody here starts from a newbie. So that's probably a good time for you to start learning how to program in java.

I have changed the sample code a bit, so it hides subtask when it is empty. And a go button is added for main task. hopefully, this serves as an example of how you can change the sample code for your needs.

<script>
<!-- Begin
// quick browser tests
var ns4 = (document.layers) ? true : false;
function show(obj, sw) {
     // show/hide the divisions
     var status = sw ? 'visible' : 'hidden';
     if( ns4 ) obj.visibility = status;
     else obj.style.visibility = status;
}
// End -->
</script>

<%
String[][] select1 = {
     { "webmaster", "Webmaster sites" },
     { "news", "News sites" },
     { "entertainment", "Entertainment" },
     { "nothing", "Nothing" }
};

String[][][] tmp = {
  {
     {"JavaScript Kit","http://javascriptkit.com"},
     {"Dynamic Drive","http://www.dynamicdrive.com"},
     {"Freewarejava.com","http://www.freewarejava.com"},
     {"Free Web Templates","http://www.freewebtemplates.com"},
     {"Web Monkey","http://www.webmonkey.com"}
  },
  {
     {"CNN","http://www.cnn.com"},
     {"MSNBC","http://www.msnbc.com"},
     {"BBC News","http://news.bbc.co.uk"},
     {"ABC News","http://www.abcnews.com"}
  },
  {
     {"Hollywood.com","http://www.hollywood.com"},
     {"MTV","http://www.mtv.com"},
     {"ETOnline","http://etonline.com"}
  },
  {}
};

java.util.Map map = new java.util.HashMap();
for( int i = 0; i < select1.length; i++ ) {
     map.put( select1[i][0], tmp[i] );
}

%>

<form name="dynamiccombo">
<div id="div1">
<select name="combo1" onChange="populate( this.options[this.selectedIndex].value )" >
     <% for( int i=0; i<select1.length; i++ ) { %>
     <option value="<%=select1[i][0]%>"><%=select1[i][1]%></option>
     <% } %>
</select>
<input type="button" name="test" value="Go!"
onClick="goTask()">
</div>

<div id="div2">
<select name="combo2" size="1">
<option value="#">This is a Place Holder</option>
</select>
<input type="button" name="test" value="Go!"
onClick="gothere()">
</div>
</form>

<script>
<!--
<% for( int i=0; i<select1.length; i++ ) { %>
     var <%=select1[i][0]%>=new Array()
     <%
          String[][] select2 = (String[][]) map.get( select1[i][0] );
          for( int j=0; j<select2.length; j++ ) {
     %>
          <%=select1[i][0]%>[<%=j%>]=new Option("<%=select2[j][0]%>", "<%=select2[j][1]%>")
     <% } %>
<% } %>

var oCombo2=document.dynamiccombo.combo2
var oCombo1=document.dynamiccombo.combo1

function populate(x){
     for (m=oCombo2.options.length-1;m>0;m--)
          oCombo2.options[m]=null
     selectedarray=eval(x)
     for (i=0;i<selectedarray.length;i++)
          oCombo2.options[i]=new Option(selectedarray[i].text,selectedarray[i].value)
     if( selectedarray.length > 0 ) {
          oCombo2.options[0].selected=true
          show( div2, true );
     } else {
          show( div2, false );
     }
}

function gothere(){
     location=oCombo2.options[oCombo2.selectedIndex].value;
}

function goTask(){
     location="edit.jsp?taskid=" + oCombo1.options[oCombo1.selectedIndex].value;
}

//SHOW first combo by default
populate( oCombo1.options[oCombo1.selectedIndex].value )

//-->
</script>
0
 
LVL 14

Accepted Solution

by:
kennethxu earned 2000 total points
ID: 8236054
you'll also need to change you bean's data structure to sure your jsp page.
0
 

Author Comment

by:bf109
ID: 8344085
kennethxu
thanks for your help. You put me on the right track.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

New style of hardware planning for Microsoft Exchange server.
In today's business world, data is more important than ever for informing marketing campaigns. Accessing and using data, however, may not come naturally to some creative marketing professionals. Here are four tips for adapting to wield data for insi…
This is my first video review of Microsoft Bookings, I will be doing a part two with a bit more information, but wanted to get this out to you folks.
In this video, Percona Solutions Engineer Barrett Chambers discusses some of the basic syntax differences between MySQL and MongoDB. To learn more check out our webinar on MongoDB administration for MySQL DBA: https://www.percona.com/resources/we…
Suggested Courses

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question