读书人

请教下拉框联动有关问题

发布时间: 2012-01-20 18:53:53 作者: rapoo

请问下拉框联动问题
我要实现一个基本的二级联动,第一个下拉框是课程,第二个下拉框是教师,要求是选择相应的课程后,教师下拉框刷新为对应的教师,课程和教师数据存储于数据库中,教师和课程的关系有一个表。
我现在是用Struts做的这个应用,没有做过一个界面的联动功能,希望各位大虾指点,编码思路或者示例代码都可以。谢谢了!

[解决办法]
给你段成功运行过的代码,给你参考下你就明白了

<%
try
{ Class.forName( "sun.jdbc.odbc.JdbcOdbcDriver ");}
catch (ClassNotFoundException ce)
{System.out.println( "SQLException: "+ce.getMessage());}
try{
Connection con = DriverManager.getConnection( "jdbc:odbc:*** ", " ", " ");
Statement stmt = con.createStatement();
ResultSet rs = stmt.executeQuery( "select * from Industry_type where Classtype <> 0 order by Classsort asc ");
%>
<script>
var onecount;
onecount=0;
subcat = new Array();
<%
int count = 0;
while(rs.next())
{
int id = rs.getInt( "ID ");
String iname = rs.getString( "Itypename ");
int type = rs.getInt( "Classtype ");
%>
subcat[ <%=count%> ] = new Array( " <%=iname%> ", " <%=type%> ", " <%=id%> ");
<%
count = count + 1;
}
rs.close();
%>
onecount= <%=count%> ;

function changelocation(locationid)
{
document.form1.itype.length = 0;

var locationid=locationid;
var i;
for (i=0;i < onecount; i++)
{
if (subcat[i][1] == locationid)
{
document.form1.itype.options[document.form1.itype.length] = new Option(subcat[i][0], subcat[i][2]);
}
}

}
</script>


<%
ResultSet rs3 = stmt.executeQuery( "select * from Industry_type where Classtype = '0 ' order by Classsort asc ");
%>
<tr>
<td height= "31 ">
<div align= "left "> 项目所属行业: </div>
</td>
<td>
<div align= "left ">
<select name= "bitype " onchange= "changelocation(document.form1.bitype.options[document.form1.bitype.selectedIndex].value) " size= "1 ">
<option value= " "> 选择大类 </option>
<%

while(rs3.next())
{
%>
<option value= " <%=rs3.getInt( "id ")%> "> <%=rs3.getString( "Itypename ")%> </option>
<%
}
rs3.close();
%>
</select>
 
<select name= "itype ">
<option value= " "> 选择小类 </option>
</select>
<%
stmt.close();
con.close();
}
catch (SQLException e)
{ System.out.println( "SQLException: "+e.getMessage());}
%>
</select>
</div> </td>
</tr>


[解决办法]
老孙长谈了,
先把教师都从数据库取出放在JS的数组中,然后在课程的下拉框中onchange()事件根据课程ID把数组中相符合的教师生成教师下拉框的选项
------解决方案--------------------


贴一个俺以前项目中的例子
<select name= "game_id " id= "game " onchange= "javascript:getaward() ">
<option value= " "> 请选择 </option>
<%
String game_id = (String) request.getAttribute( "game_id ");
IntegralChange ic = new IntegralChange();
List list2 = ic.getGame();
if (list2 != null && list2.size() > 0) {
HashMap hm2 = null;
for (int i = 0; i < list2.size(); i++) {
hm2 = (HashMap) list2.get(i);
if (hm2.get( "game_id ").toString().equals(game_id)) {
%>
<option value= " <%=hm2.get( "game_id ").toString()%> " selected>
<%=hm2.get( "game_name ")%>
</option>
<%
} else {
%>
<option value= " <%=hm2.get( "game_id ").toString()%> ">
<%=hm2.get( "game_name ")%>
</option>
<%
}
}
}
%>
</select>


这是二级select
<select name= "award_name " id= "award " onchange= "javascript:setscore() ">
<option value= " "> 请选择 </option>
<%
List list3=(List)request.getAttribute( "awards ");
if(list3!=null&&list3.size()> 0){
HashMap hm3=null;
for(int i=0;i <list3.size();i++){
hm3=(HashMap)list3.get(i);
%>
<option value= " <%=hm3.get( "award_id ")%> "> <%=hm3.get( "award_name ")%>  ( <%=hm3.get( "score ")%> 分) ( <%=hm3.get( "award_num ") %> 个) </option>
<%
}
}


%>

</select>

这是那个触发的JS
function getaward(){
game_id=document.form1.game.value;
document.form1.action = "getaward.jsp?game_id= "+game_id;
document.form1.submit();
}

读书人网 >Java Web开发

热点推荐