下拉框代码

<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" onchange="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" onchange="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>

ajax实现下拉列表联动的更多相关文章

  1. JS ajax 应用 (下拉列表联动)

        <script language="javascript"> var http_request=false;    function send_request( ...

  2. JAVA EE 项目经常使用知识 之AJAX技术实现select下拉列表联动的两种使用方法(让你真正理解ajax)

    ajax 下拉列表联动的使用方法. ajax的定义: AJAX 是一种用于创建高速动态网页的技术. 通过在后台与server进行少量数据交换,AJAX 能够使网页实现异步更新.这意味着能够在不又一次载 ...

  3. JQuery+Ajax实战三级下拉列表联动(八)

    本片文章为练习,项目中不会这样写: 一:涉及到的知识点: jQuery Dom操作 jQuery Ajax操作 ASP.net中的json操作 二:用了自动代码生成器 1.Dal层的代码: publi ...

  4. JAVA EE 项目常用知识 之AJAX技术实现select下拉列表联动的两种用法(让你真正理解ajax)

    ajax 下拉列表联动的用法. ajax的定义: AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的 ...

  5. AJAX部分---对比js做日期的下拉选择 和 ajax做三级联动;

    js做日期选择: 实现当前年份的前5后5年的日期选择 实现功能:年份和月份页面加载完成使用JS循环添加,天数根据月份的变化动态添加改变 扩展功能:天数可以根据闰年平年变化 <body> & ...

  6. 转:『代码』JS封装 Ajax级联下拉列表

    在博客园看到一篇不错的AJAX级联下拉列表,觉得不错,特地拿下来 :转载来自:『大雪无痕』 ,原文地址 //当一个 下拉列表 改变时,触发所有联动:(警告:各下拉列表之间 请不要出现 循环依赖) // ...

  7. JQ+AJAX实现多级联动

    利用JQ与AJAX实现三级联动实现的效果: 当前两级改变时,后边一级或两级都会改变: 使用的数据库: html代码: <!doctype html> <html lang=" ...

  8. 基于MVC3下拉列表联动(JQuery)

    上次项目中遇到一个需要多个下拉列表联动的操作,今天有空将实现方式整理以便以后参考. 要达到的效果是,点击一个下拉框,则另一个下拉框的值发生对应变化.如:选择中国,则另个一下拉框里显示中国各个省份. 传 ...

  9. ajax 实现三级联动

    ajax 实现三级联动,相当于写了一个小插件,用的时候直接拿过来用就可以了,这里我用了数据库中的chinastates表, 数据库内容很多,三级联动里的地区名称都在里面,采用的是代号副代号的方式 比如 ...

随机推荐

  1. Win32_Battery class

    wmi的Win32_Battery类实现 其中EstimatedChargeRemaining属性返回剩余电量的百分比,EstimatedRunTime属性返回剩余时间(分钟) 其他属性参考http: ...

  2. xhEditor实现插入代码功能

    如果大家经常使用CSDN或者其他技术博客,都会有插入程序代码或脚本功能 开源中国 CSDN 这里介绍xhEditor实现插入代码功能,对xhEditor进行插件扩展 一.首先定义插件样式 <st ...

  3. C#中易混淆的知识点

    C#中易混淆的知识点 一.引言 今天在论坛中看到一位朋友提出这样的一个问题,问题大致(问题的链接为:http://social.msdn.microsoft.com/Forums/zh-CN/52e6 ...

  4. jQuery.fn.attr与jQuery.fn.prop

    jQuery.fn.attr与jQuery.fn.prop jQuery.fn.attr.jQuery.fn.prop的区别 假设页面有下面这么个标签,$('#ddd').attr('nick').$ ...

  5. 我的TDD实践---SVN架设篇

    我的TDD实践---SVN架设篇 “我的TDD实践”系列之SVN架设 写在前面: 我的TDD实践这几篇文章主要是围绕测试驱动开发所展开的,其中涵盖了一小部分测试理论,更多的则是关注工具的使用及环境的搭 ...

  6. SVN-钩子祥解与配置

    钩子脚本的具体写法就是操作系统中shell脚本程序的写法,请根据自己SVN所在的操作系统和shell程序进行相应的写作 所谓钩子就是与一些版本库事件触发的程序,例如新修订版本的创建,或是未版本化属性的 ...

  7. Android开发(25)--framebyframe帧动画并实现启动界面到主界面的跳转

    Drawable animation可以加载Drawable资源实现帧动画.AnimationDrawable是实现Drawable animations的基本类.推荐用XML文件的方法实现Drawa ...

  8. jvm内存JVM学习笔记-引用(Reference)机制

    在写这篇文章之前,xxx已经写过了几篇关于改jvm内存主题的文章,想要了解的朋友可以去翻一下之前的文章 如果你还不了解JVM的基本概念和内存划分,请阅读JVM学习笔记-基础知识和JVM学习笔记-内存处 ...

  9. 深刻理解HDFS工作机制

    深入理解一个技术的工作机制是灵活运用和快速解决问题的根本方法,也是唯一途径.对于HDFS来说除了要明白它的应用场景和用法以及通用分布式架构之外更重要的是理解关键步骤的原理和实现细节.在看这篇博文之前需 ...

  10. LeetCode题解 15题 第二篇

    之前写过一篇,这是第二篇.上一篇用了多种编程语言来做,这一次是以学算法为主,所以打算都用python来完成. 4. Median of Two Sorted Arrays There are two ...