请教如下问题：有两个下拉框（内容都从数据库中读取出来的），从下拉框中选择大类，显示相应的小类

Question

有两个表，
表一：b_sort
     CODE VARCHAR2(2) NOT NULL, 
     NAME  VARCHAR2(20) NOT NULL, 表二：s_sort
     CODE VARCHAR2(2) NOT NULL, 
     NAME  VARCHAR2(20) NOT NULL, 
     BCCODE VARCHAR2(2) NOT NULL
<table width="313" border="0" cellspacing="1" cellpadding="0" height="207">
  <tr> 
    <td height="55" bgcolor="#DDECCE" align="center"> 选择大类: 
       <select name="b_code" class="box"> 
         <option value="">请选择大类</option>
         <%//从表b_sort中读出%>
</select>
  
    </td>
  </tr>
    <tr> 
    <td height="55" bgcolor="#DDECCE" align="center"> 小类名称: 
   <select name="sc_name">
    <option>请选择小类</option>
<select name="b_code" class="box"> 
         <option value="">请选择大类</option>
         <%//根据大类中的选择的code 值从表s_sort中读出%>
</select>
    </td>
  </tr>
  <tr> 
    <td height="44" bgcolor="#DDECCE"> 
      <div align="center"> 
        <input type="submit" name="Submit" value="删除">
      </div>
    </td>
  </tr>
</table>

Answer 1

可以用dwr实现,下面是我以前做的三级联动,楼主可以参考下
   function go3()
{
GoodsTypeBiz.findGoodsType(setType3);
}
 function setType3(data)
 {      
        var shiObj=document.getElementById("goodsTypeId");
        DWRUtil.removeAllOptions(shiObj);
       var nitem = new Option("选择大类别",""); 
      shiObj.options.add(nitem);           
        for(var i in data){ //i代表索引号
var item = new Option(data[i].goodsTypeName,data[i].goodsTypeId); 
shiObj.options.add(item);
    }        
  }
function go(id)
{
GoodsTypeBiz.findGoodsDType(id,setDtype);
}
 function setDtype(data)
 {      
        var shiObj=document.getElementById("goodsDtypeId");
        DWRUtil.removeAllOptions(shiObj);
       var nitem = new Option("选择二级类别",""); 
      shiObj.options.add(nitem);           
        for(var i in data){ //i代表索引号
var item = new Option(data[i].goodsDtypeName,data[i].goodsDtypeId); 
shiObj.options.add(item);
    }        
  }
  function go2(id)
{
GoodsTypeBiz.findGoodsXType(id,setDtype2);
}
 function setDtype2(data)
 {      
        var shiObj=document.getElementById("goodsXtypeId");      
        DWRUtil.removeAllOptions(shiObj); 
        var nitem = new Option("选择三级类别",""); 
      shiObj.options.add(nitem); 
    for(var i in data){ //i代表索引号
var item = new Option(data[i].goodsXtypeName,data[i].goodsXtypeId); 
shiObj.options.add(item);
    }    
  }

Answer 2

嗯 行 楼主你会用dwr吗？

Answer 3

行 那就这样！你先把大类的所有类别读取出来！放到一个List里面,然后在下拉框中显示，option给它对应的id
 当你选择下拉框项的时候,触犯onchange事件调用js方法
楼主主要看如何使用dwr使用DWR:(1)向站点引入dwr类库;
(2)在web.xml中配置DwrServlet;
(3)编写简单JAVA类;
(4)在 dwr.xml 中配置JAVA类;
(5)调用java类;
下面是ajax的主要代码
(1)客户端发送请求和接收回应
<%@ page language="java" pageEncoding="gb2312"%>
<script language="javascript">
var http_request; //func1()用来接收服务器的回应信息.
function func1(){
if (http_request.readyState == 4) { //判断服务器回送的响应是否全部到达客户端.
if (http_request.status == 200) {//判断服务器回送的响应是否为异常信息.200代表正常回应.
str1=http_request.responseText;//得到回应文本.
window.alert(str1);//显示回应文本.
}
}
} //send()用来向服务器发送请求.
function send(){
var name,pass;
name=username.value;//取文本框的值.
pass=userpass.value;

//生成xmlhttp对象,用以与服务器通信.
http_request = new ActiveXObject("Microsoft.XMLHTTP");  //设置回调函数.服务器回应信息到达客户端时,func1会自动执行.
http_request.onreadystatechange=func1; //打开到服务器间的连接.
http_request.open("POST", "loginservlet", true); //设置要发送的数据的格式.
http_request.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); //发送数据.
http_request.send("username="+name+"&userpass="+pass);
}
</script>用户名:<input size="10" name="username"/><br/>
密码:<input size="10" name="userpass" type="password"/><br/>
<input type="button" value="登录" onclick="send();"/>
(2)向客户端回送中文响应：
try {
response.setContentType("text/html;charset=gb2312");
PrintWriter out=response.getWriter();//该语句必须在setCharacterEncoding("gb2312")之后.
out.println(response_str);
out.flush();//刷流,将服务器端数据强制发送到客户端.否则服务器会进行缓存.
} catch (Exception e) {
e.printStackTrace();
}
(3)接收Ajax发送过来的中文：
username=new String( username.getBytes("iso8859-1"),"utf-8" );

Answer 4

楼主主要看如何使用dwr,下面是ajax楼主了解一下就行,现在你主要用到的还是dwr！

Answer 5

由于时间紧，已经用层的方法解决了，谢谢EverWHL(Ever亮)，虽然你的方法现在我还掌握不了，需要很长一段时间去研究，但还是非常感谢你的热心解答！