Ajax二级联动下拉框

JSP:

 

课程名称:
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/options.js"></script>

 <html:select property="icourseId" οnchange="change(this)" style="width:180px;">
      <html:option value="0">----请选择以下课程----</html:option>
      <html:options collection="clist" labelProperty="ccourseName"                    property="icourseId"></html:options>
</html:select>
课程章节:
 <select name="ichapterId" id="result" style="width:180px;">
 <option value="">----请选择以下章节----</option>
</select>

 

******************************************************************************
options.js:

 

function change(option){
 var opvalue = option.value;
 //设置与服务端进行交互的URL(包括中文处理)
 var url = "options.do?opvalue="+encodeURI(encodeURI(opvalue));
 url = covertURL(url);
 //与服务端进行交互,并显示数据
 $.get(url,null,function(data){$("#result").html(data);});
}
//处理缓存问题
function covertURL(url){
   var timeURL = (new Date()).valueOf();
   if(url.indexOf("?") >= 0){
       url = url + "&t=" + timeURL;
   }else{
       url = url + "?t=" + timeURL;
   }
   return url;
  }

 

***************************************************************************
ACTION:

 

public class OptionsAction extends Action {
 private WebService webservice;
 
 public void setWebservice(WebService webservice) {
  this.webservice = webservice;
 }
 
 public ActionForward execute(ActionMapping mapping, ActionForm form,
   HttpServletRequest request, HttpServletResponse response) {
  response.setContentType("text/html;charset=UTF-8");
  String cid = request.getParameter("opvalue").trim();
  PrintWriter out = null;
  String responseContext = "";
  
  try {
   List<Chapter>  list = webservice.selectOptionsReport(cid);
   if(!list.isEmpty()){
       for(Chapter chapter : list){
            responseContext += "<option value='"+chapter.getIchapterId()+"'>"+chapter.getCchapterName()+"</option>";
       }
   }
   
  } catch (Exception e1) {
   
   e1.printStackTrace();
  }
  try {


   out = response.getWriter();


  } catch (IOException e) {
   
   e.printStackTrace();
  }
  
  out.print(responseContext);
  out.flush();
  out.close();
  return null;
 }
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值