Jquery Json 下拉联动
#region dataTable转换成Json格式
/// <summary>
/// dataTable转换成Json格式
/// </summary>
/// <param name="dt"></param>
/// <returns></returns>
public static string DataTable2Json(DataTable dt)
{
StringBuilder jsonBuilder = new StringBuilder();
jsonBuilder.Append("{\"dept");
jsonBuilder.Append(dt.TableName);
jsonBuilder.Append("\":[");
jsonBuilder.Append("[");
for (int i = 0; i < dt.Rows.Count; i++)
{
jsonBuilder.Append("{");
for (int j = 0; j < dt.Columns.Count; j++)
{
jsonBuilder.Append("\"");
jsonBuilder.Append(dt.Columns[j].ColumnName);
jsonBuilder.Append("\":\"");
jsonBuilder.Append(dt.Rows[i][j].ToString());
jsonBuilder.Append("\",");
}
jsonBuilder.Remove(jsonBuilder.Length - 1, 1);
jsonBuilder.Append("},");
}
jsonBuilder.Remove(jsonBuilder.Length - 1, 1);
jsonBuilder.Append("]");
jsonBuilder.Append("]");
jsonBuilder.Append("}");
return jsonBuilder.ToString();
} #endregion dataTable转换成Json格式
前台
HTML代码
<lable>院区选择:</lable>
<input class="yq" type="radio" name="hospital" id="radio" value="0" checked="checked"><label for="radio">西院</label>
<input class="yq" type="radio" name="hospital" id="radio2" value="2"><label for="radio2">东院</label>
<select style="width: 100px;" id="deptCode" name="deptCode">
<option value="">全部科室</option>
</select>
<select style="width: 100px;" id="docCode" name="docCode">
<option value="">全部医生</option>
</select>
$(function () {
//此处我放的是 radio 的选中事件
$("input[name=hospital]").click(function () { //获取radio 选中的值
var hospital = $("input[name='hospital']:checked").val(); $.post("@Url.Action("GetDeptByHospital", "PatientBooking")", { hospital: hospital }, function (data) {
//将返回的json eval()
var jsonList = eval("(" + data + ")"); $.each(jsonList.dept, function (index, b) { for (var i = 0; i < b.length; i++) {
//将值循环添加到 下拉列表中 ------- deptCode=下拉列表的ID
$("#deptCode").append('<option value=' + b[i].dept_code + '>' + b[i].dept_name + '</option>'); }
}) });
});
});
下拉联动效果代码
$('#deptCode').change(function () {
var hospital = $("input[name='hospital']:checked").val();
var DeptCode = $("#deptCode").val();
$.post("@Url.Action("YY08GetDeptMedicalByHospitalAndDeptCode", "PatientBooking")", { hospital: hospital,deptCode:DeptCode }, function (data) { var jsonList = eval("(" + data + ")"); $.each(jsonList.dept, function (index, b) { for (var i = 0; i < b.length; i++) {
// expert_id,expert_name = json 定义的字段
$("#docCode").append('<option value=' + b[i].expert_id + '>' + b[i].expert_name + '</option>'); }
}) });
});
Jquery Json 下拉联动的更多相关文章
- Jquery实现下拉联动表单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery实现下拉联动
很多项目用到这个功能,虽然写了不下5次以上了,一直没做过记录,记录一下,下次直接拷贝了,免得还得要重复写浪费时间. 先上HTML代码: 品牌: <select class="sa&qu ...
- Json 基于jQuery+JSON的省市联动效果
helloweba.com 作者:月光光 时间:2012-09-12 21:57 标签: jQuery JSON Ajax 省市联动 省市区联动下拉效果在WEB中应用非常广泛,尤其在一些 ...
- 基于jQuery+JSON的省市联动效果
省市区联动下拉效果在WEB应用中使用非常广泛,尤其在一些会员信息系统.电商网站最为常见,开发者一般使用AJAX实现无刷新下拉联动. 本文将讲述利用jQuery插件,通过读取JSON数据,实现无刷新动态 ...
- AJAX二级下拉联动【XML方式】
AJAX二级下拉联动案例 我们在购物的时候,常常需要我们来选择自己的收货地址,先选择省份,再选择城市- 有没有发现:当我们选择完省份的时候,出现的城市全部都是根据省份来给我们选择的.这是怎么做到的呢? ...
- jquery div 下拉框焦点事件
这章与上一张<jquery input 下拉框(模拟select控件)焦点事件>类似 这章讲述div的焦点事件如何使用 div的焦点事件与input的焦点事件区别在于 需要多添加一个属性: ...
- Jquery操作下拉框(DropDownList)实现取值赋值
Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('sele ...
- jQuery水平下拉菜单实现
<!DOCTYPE html> <html> <head> <title>jQuery水平下拉菜单实现</title> ...
- jquery 获取下拉框值与select text
下面先介绍了很多jquery获取select属性的方法,同时后面的实例我们讲的是jquery 获取下拉框值与select text代码. 下面先介绍了很多jquery获取select属性的方法,同时后 ...
随机推荐
- tomcat在linux中启动慢的解决方案
有两种解决办法: 1)在Tomcat环境中解决 可以通过配置JRE使用非阻塞的Entropy Source. 在catalina.sh中加入这么一行:-Djava.security.egd=file: ...
- Swift 写纯洁的TableviewCell
let initIdentifier = "员工" var cell = tableView.dequeueReusableCell(withIdentifier: initIde ...
- PeopleSoft Rich Text Boxes上定制Tool Bars
在使用PT8.50或在8.51时,你可能遇到过Rich-text编辑框.该插件使你能够格式化文本,添加颜色.链接.图片等等.下面是效果图: 如果页面中只有这么一个字段,该文本框就会有足够的空间来容 ...
- 【003:jsoncpp的简单使用】
#include <json/json.h> #include <iostream> #include <string> using namespace std; ...
- linux安全运维之谁动了chattr
安全一直是老生常谈的问题,今天我们来谈谈chattr. 如果涉及到侵权问题:请联系w18030432178@outlook.com,我会尽快删除帖子 目录 0.chattr的简介 0.0 chattr ...
- asp.net5 Area的处理
Controller加上Attribute [Area("SystemSecurity")] startup中配置 app.UseMvc(routes => { // Are ...
- [转载] linux 下查看机器cpu是几核的
linux 下查看机器cpu是几核的 本文转自”映月的博客“:http://wurhuangfeng.blog.163.com/blog/static/35178241201111235829116/ ...
- MVC 中301永久重定向
public class PermanentRedirectResult : ViewResult { public string Url { get; set; } public Permanent ...
- IE9浏览器中的My97日历控件刷新后无法打开问题解决办法
解决办法如下: 1:找到WdatePicker.js 2:将$crossFrame:true 改为$crossFrame:false. 3:重启服务,刷新页面发现OK.
- 让C#轻松实现读写锁分离
ReaderWriterLockSlim 类 表示用于管理资源访问的锁定状态,可实现多线程读取或进行独占式写入访问. 使用 ReaderWriterLockSlim 来保护由多个线程读取但每次只采用一 ...