下拉框代码

<fieldset style="margin-bottom:5px;">
<div class="form-group">
<label for="disabledSelect" class="col-sm-4 control-label">医院名称</label>
<div class="col-sm-8">
<select id="hospitalCode" class="form-control" name="hospitalCode" οnchange="handle();">
<c:forEach items="${institutionList }" var="institution">
<option value="${institution.medInstitutionCode }" <c:if test="${institution.medInstitutionCode == doctorSchedule.hospitalCode }">selected="selected"</c:if>>${institution.medInstitutionName }</option>
</c:forEach>
</select>
</div>
</div>
</fieldset>

<input type="hidden" name="scheduleId" value="${doctorSchedule.scheduleId }"/>
<input type="hidden" name="id" value="${doctorSchedule.id }"/>
<fieldset style="margin-bottom:5px;">
<div class="form-group">
<label for="disabledSelect" class="col-sm-4 control-label">科室名称</label>
<div class="col-sm-8">
<select id="keshiCode" class="form-control" name="keshiCode" οnchange="keshi();">
<option value="${doctorSchedule.keshiCode }">${doctorSchedule.keshi }</option>
</select>
</div>
</div>
</fieldset>
<fieldset style="margin-bottom:5px;">
<div class="form-group">
<label for="disabledSelect" class="col-sm-4 control-label">医生姓名</label>
<div class="col-sm-8">
<select id="doctorId" class="form-control" name="doctorId">
<option value="${doctorSchedule.doctorId }">${doctorSchedule.doctorName }</option>
</select>
</div>
</div>
</fieldset>

js代码

<script type="text/javascript">
function handle(){
var hospitalCode = $("#hospitalCode").val();
//alert(aaa);
$.ajax({
type: "post",
url: "xxx.json",
data: {"hospitalCode":hospitalCode},
dataType: "json",
success: function(date){
//var dataObj = eval("("+data+")");
var dataObj = eval(date);
//alert(dataObj.data[0].keshiName);
var dataArr = dataObj.data;
var keshi = $("#keshiCode");
keshi.empty();
if(date==null){
keshi.append("<option value = '-1'>"+"科室为空"+"</option>");
}
if(dataArr!=null){
for(var i =0;i<dataArr.length;i++){
var item=dataArr[i];
keshi.append("<option value = '"+item.keshiCode+"'>"+item.keshiName+"</option>");
};
}
}
});
}

function keshi(){
var keshiCode = $("#keshiCode").val();
//alert(keshiCode);
$.ajax({
type: "post",
url: "xxx.json",
data: {"keshiCode":keshiCode},
dataType: "json",
success: function(date){
//var dataObj = eval("("+data+")");
var dataObj = eval(date);
//alert(dataObj.data[0].keshiName);
var dataArr = dataObj.data;
var doctor = $("#doctorId");
doctor.empty();
if(date==null){
doctor.append("<option value = '-1'>"+"医生为空"+"</option>");
}
if(dataArr!=null){
for(var i =0;i<dataArr.length;i++){
var item=dataArr[i];
doctor.append("<option value = '"+item.doctorId+"'>"+item.userName+"</option>");
};
}
}
});
}
</script>

转载于:https://www.cnblogs.com/luchangyou/p/5775643.html

ajax实现下拉列表联动相关推荐

  1. ajax初级示例(下拉列表联动)

    下拉列表联动效果如下动图: 数据库 表字段的信息 新建web项目 jar包及js 实体对象 index.jsp <%@ page language="java" conten ...

  2. php下拉列表 二级 联动,PHP+Ajax实现二级联动下拉菜单!

    正文 字体大小: 中 PHP+Ajax实现二级联动下拉菜单! (2009-12-05 01:11:39) 标签: 杂谈 数据库 .................................... ...

  3. php js 二级联动_PHP+ajax实现二级联动菜单功能示例

    本文实例讲述了PHP+ajax实现二级联动菜单功能.分享给大家供大家参考,具体如下: 如何实现二级联动 工作原理 二级联动在开发中是比较常见的一个技术点,它主要运用了JS的局部刷新技术ajax,不同于 ...

  4. html用ajax做三级联动,怎样使用JS+AJAX做出三级联动

    这次给大家带来怎样使用JS+AJAX做出三级联动,使用JS+AJAX做出三级联动的注意事项有哪些,下面就是实战案例,一起来看一下. js 三级联动的实现代码如下所示: js原生ajax -请选择 省/ ...

  5. excel下拉列表联动_动态数组的Excel下拉列表

    excel下拉列表联动 Select a region name in one Excel drop down list. Then, in the next drop down list, sele ...

  6. excel下拉列表联动_国家和城市的Excel下拉列表

    excel下拉列表联动 In Excel, you can use data validation to create drop down lists on a worksheet. Usually, ...

  7. ajax的列表联动示例

    ajax的列表联动示例 1.  输入域: 请选择省: <select id="sel1" onchange="return choose(this);"& ...

  8. 使用Ajax实现省市联动Bootstrap的基本使用

    上节课我们已经讲了Ajax了,现在我们来使用Ajax来实现省市联动以及bootstrap的一些基本使用 目录 一.案例(使用Ajax实现省市联动) 二.Bootstrap的基本介绍 三.bootstr ...

  9. 基于JQuery Ajax实现三级联动获取SpringMVC接口的数据(详细一套)

    本文实例为大家分享了ajax实现三级联动的具体代码,供大家参考(复制下来就可以用) 一.省市县数据表可见:全国各.省.市区/县sql语句 二.点我:切换二级联动 在静态页面写调用服务端接口,获取省.市 ...

最新文章

  1. 通电就可以工作,这些单片机真香!
  2. Mybatis查询传递单个参数和传递多个参数用法
  3. luogu2577/bzoj1899 午餐 (贪心+dp)
  4. itertools chain
  5. Eclipse中使用Git-让版本管理更简单
  6. 个人课中所学vlan相关知识整理
  7. [Android开发]zip文件压缩解压缩
  8. flutter 返回指定界面_Flutter 即学即用系列博客——04 Flutter UI 初窥
  9. TJU_SCS_软件测试_Lab1
  10. 一元、二元、三元逻辑运算符
  11. 双线性的定义以及他的性质
  12. 同济版《线性代数》引发激烈争议!
  13. Python: 用matplotlib.pyplot,绘制 cos 与 sin 函数图像
  14. IplImage详解
  15. 计算机专业网页设计周志,毕业论文(设计)周志范文.doc
  16. CGContextRef绘图-iOS球形波浪加载进度控件-HcdProcessView详解 1
  17. windows彻底永久关闭自动更新的方式
  18. hadoop 3.3.1 安装笔记
  19. 计算机 黑屏 显示桌面,电脑开机后显示桌面黑屏了怎么处理啊?
  20. APP设计之启动页和广告页

热门文章

  1. linux 错误处理命令,Linux运行脚本命令提示No such file or directory错误的解决办法
  2. Qt学习之路(28): 坐标变换
  3. web前端性能分析--实践篇
  4. 2014第3周四杂记
  5. 最新最全产品删除页代码
  6. ckeditor和ckfinder的使用
  7. HDU 3473 Minimum Sum
  8. 可以无限量服用的药材
  9. linux下的bc计算器设置scale精度
  10. [SQLITE_READONLY] Attempt to write a readonly databse (attempt to write a readonly database)