需求类似这样  ↓ ↓ ↓

  --》   

菜单A发生变化,动态取数据填充下拉菜单B。

JS代码如下:

<script type="text/javascript">
$(function () {
$("#TeamSelect").change(function () { var tid = $("#TeamSelect option:selected").val();
$.ajax({
url: "/ajax/ajaxGetManagerByTeam.aspx?teamId="+tid,
type: "Post",
contentType: "application/json",
dataType: "json",
success: function (data) {
var ddl = $("#ManagerSelect");
             //删除节点
$("#ManagerSelect option").remove();
//转成Json对象
var result = eval(data);
//循环遍历 下拉框绑定
$(result).each(function (key) {
                //添加option 对应Json对象名称
var opt = $("<option></option>").text(result[key].ManagerName).val(result[key].ManagerID);
ddl.append(opt);
});
},
error: function () {
alert("Error");
}
});
});
}); </script>

ajaxGetManagerByTeam.aspx.cs页面代码如下:

     protected void Page_Load(object sender, EventArgs e)
{
var teamId = ;
try
{
var teamIdStr = Request.QueryString["teamId"];
if (!string.IsNullOrEmpty(teamIdStr))
{
int.TryParse(teamIdStr, out teamId);
DataTable dt = GetManager(teamId); //GetManager()是一个返回DataTable类型数据的方法
            string proStr = JsonConvert.SerializeObject(dt); //将DataTable序列化为Json格式的字符串
Response.ContentType = "text/plain";
Response.Write(proStr); }
}
catch(Exception ex)
{
Response.Write(ex);
} }

另可给Select添加默认项:

$("#ManagerSelect").append("<option value='-1'>全部</option>");

//或者

$("#ManagerSelect")[].options.add(new Option("全部", "-1"));

Select级联菜单,用Ajax获取Json绑定下拉框(jQuery)的更多相关文章

  1. 奥展项目笔记07--vue绑定下拉框和checkbox总结

    1.vue绑定下拉框 <div class="col-md-1 data"> <select class="form-control " v- ...

  2. MVC联想查询绑定下拉框

    前言 在做搜索时,输入些内容时需要弹出下拉框给用户进行选择,极大的方便了用户,会给用户带来不一样的体验 Controller public ActionResult SSAC(string UserN ...

  3. WPF AutoGeneratingColumn 绑定下拉框

    WPF自动产生列,前台代码: <DataGrid x:Name="Dg" AutoGenerateColumns="True" CanUserAddRow ...

  4. 关于safari上的select宽高问题小技,自定义下拉框

    之前一直用windows做开发,最近换了个mac,在几经折腾之下,安装完了各种开发工具,IDE等,然后欣然打开自己正在开发的网站.突然发现mac上所有的下拉框都变了,都是默认样式,无论padding, ...

  5. vue 获取数据联动下拉框select ,并解决报Duplicate value found in v-for="...": "". Use track-by="$index" 错误

    公司项目中遇到一个问题,联动下拉框,并且数据是使用vue-resource从后台获取的,格式不利于输出联动下拉框,联动下拉框是第一个下拉框输出一个数组里每一项json的一个text值,从而第二下拉框输 ...

  6. JQ与AJAX 省市区三级联动下拉框

    用于初学者学习基本的联动下拉框,废话不多说,见代码 首先看控制器里的3个下拉框对应代码: public ActionResult GetProvinceList() { ProvinceReposit ...

  7. MVC4 绑定下拉框方法,解决编辑时不绑定值

    方法一  Controller 部分代码: public ActionResult Modify(int id) { //3.1.1 检查id //3.1.2根据id查询数据 Models.Stude ...

  8. js绑定下拉框

    ---恢复内容开始--- 方法一 js-ajax部分 function GetDListOfCt() { $.ajax({ url: "../../Ajax/Boss_Show.ashx?t ...

  9. jquery easyui无法绑定下拉框内容

    最近在研究jquery easyui的DataGrid,发现DataGrid中的下拉框无法绑定值,找了很久也没发现是具体问题所在,最后还是同事帮忙搞定的.具体问题竟然是jquery easyui提供的 ...

随机推荐

  1. 爬虫之UserAgent

    UserAgent简介 UserAgent中文名为用户代理,是Http协议中的一部分,属于头域的组成部分,UserAgent也简称UA.它是一个特殊字符串头,是一种向访问网站提供你所使用的浏览器类型及 ...

  2. 前端基础之BOM和DOM和三个小示例(计时器、搜索框、select联动)

    一.BOM和DOM JavaScript分为 ECMAScript,DOM,BOM. BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏览器进 ...

  3. Navicat工具、pymysql模块、数据备份

    IDE工具介绍(Navicat) 生产环境还是推荐使用mysql命令行,但为了方便我们测试,可以使用IDE工具,我们使用Navicat工具,这个工具本质上就是一个socket客户端,可视化的连接mys ...

  4. SQL Server 排名函数

    个函数进行的解释. 以下是对这4个函数的解释: RANK() 返回结果集的分区内每行的排名.行的排名是相关行之前的排名数加一. 假设两个或多个行与一个排名关联,则每一个关联行将得到同样的排名. 比如, ...

  5. sqlserver表结构查询语句

    SELECT syscolumns.name,systypes.name,syscolumns.isnullable,syscolumns.length FROM syscolumns, systyp ...

  6. sdut3140 A*B(math)

    题目:传送门 题目描述 Your task is to find the minimal positive integer number Q so that the product of digits ...

  7. zen-cart安装出现时区错误解决办法

    有时候在安装zen-cart的时候出现时区错误,提示: ERROR: date.timezone not set in php.ini. Please contact your hosting com ...

  8. Vue组件的定义方式

    1.使用template标签定义组件 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...

  9. DevStore分享:月薪3万的程序员都避开了哪些坑

    程序员薪水有高有低,有的人一个月可能拿30K.50K,有的人可能只有2K.3K.同样有五年工作经验的程序员,可能一个人每月拿20K,一个拿5K.是什么因素导致了这种差异?我特意总结了容易导致薪水低的九 ...

  10. NC开发笔记指导

    修改端口 InvocationInfoProxy.getInstance().get().getUserCode(); 前台 Nchome F:\JAVA\Projects\ERPEHROA\ufid ...