---恢复内容开始---

方法一

js-ajax部分

   function GetDListOfCt() {
$.ajax({
url: "../../Ajax/Boss_Show.ashx?type=GetCtName",
data: {},
type: "post",
dataType: "json",
success: function (data) {
var ddl = $("#ddlCaption");
for (var i = 0; i < data.length; i++) {
var text = data[i].RealName;
var value = data[i].id ;
document.getElementById('ddlCaption').add(new Option(text, value));//绑定DropDownList的value值,text值
} },
});
}

方法二

js部分

Js代码 1  <script type="text/javascript">
$(function () {
$("#btnGet").click(function () {
$.ajax({
url: "GetDatas.ashx",
type: "Post",
contentType: "application/json",
dataType: "json",
success: function (data) {
var ddl = $("#ddlDatas"); //删除节点
RemoveOption(); //方法1:添加默认节点
ddl.append("<option value='-1'>--请选择--</option>"); //方法2:添加默认节点
//ddl[0].options.add(new Option("--请选择--", "-1")); //转成Json对象
var result = eval(data); //循环遍历 下拉框绑定
$(result).each(function (key) {
//第一种方法
var opt = $("<option></option>").text(result[key].ProName).val(result[key].ProID);
ddl.append(opt); //第二种方法
// var proid = result[key].ProID;
// var proname = result[key].ProName;
//调用自定义方法
//AppendOption(proid, proname);
}); //第三种方法
//$.each(result, function (key, value) {
//alert("dd");
//var op = new Option(value.ProName, value.ProID);
// ddl[0].options.add(op);
// });
},
error: function (data) {
alert("Error");
}
});
}); }); function RemoveOption() {
$("#ddlDatas option").remove();
} function AppendOption(value, text) {
$("#ddlDatas").append("<option value='" + value + "'>"+ text + "</option>");
}
</script>

html部分

Html1 <body>
<form id="form1" runat="server">
<div>
<asp:DropDownList ID="ddlDatas" name="prov" runat="server" style="width:200px;">
</asp:DropDownList>
<input type="button" id="btnGet" value="获取数据" />
</div>
</form>
</body>

ajax部分

         using Newtonsoft.Json; 

       DataTable dt = ds.Tables[];
string dtg = JsonConvert.SerializeObject(dt);
context.Response.Write(dtg);
context.Response.End();

(此内容仅自己收藏查阅。若侵犯布者利益 ,请与我联系删除)

内容选自  http://www.cnblogs.com/holyknight-zld/archive/2012/10/23/Json_Bind_DropDownList.html

---恢复内容结束---

js绑定下拉框的更多相关文章

  1. js绑定下拉框数据源

    ··· buildRule:function (ruleId) { var ruleList = internal.ruleList; if(ruleList){ var programme_sel= ...

  2. JS模拟下拉框select

    最近做的一个项目有下拉框 同事都是用的是美化控件,但是用美化控件当然是好 但是网上找的一个控件不知道扩展性怎么样?对以后的维护会不会造成有影响?比如我想增加一个功能或者减少一个功能会不会影响?还有就是 ...

  3. Js获取下拉框选定项的值和文本

    Js获取下拉框的值和文本网上提供了2种方法:但有些人很不负责任,他们根本没考虑到浏览器之间的差异导致的错误,导致很多新手琢磨了半天找不出错误! 下面我总结下Firefox和IE下获取下拉框选定项的值和 ...

  4. WPF AutoGeneratingColumn 绑定下拉框

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

  5. js改变下拉框内容

      js改变下拉框内容 CreateTime--2018年4月8日18:47:38 Author:Marydon 适用场景:通常情况下,级联菜单.通过ajax异步获取后台数据改写下拉框内容会有这种需求 ...

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

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

  7. JS 实现下拉框去重

    JS 实现下拉框去重 学习内容: 需求 总结: 学习内容: 需求 用 JS 下拉框去重 实现代码 <html> <head> <meta http-equiv=" ...

  8. JS 实现下拉框回显

    JS 实现下拉框回显 学习内容: 需求 总结: 学习内容: 需求 用 JS 实现下拉框回显 实现代码 <!DOCTYPE html> <html lang="en" ...

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

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

随机推荐

  1. HDU5810 Balls and Boxes

    Balls and Boxes                                                                            Time Limi ...

  2. hdu 4069 垃圾数独

    首先dfs给每个格子分一个大的区块 其次套板子就a 我一开始直接在选取行的时候填数独,发现超时 我这一行也就4个元素,找到 x <= 81 的列计算元素位置,81 < x <= 16 ...

  3. day19_雷神_django第二天

    django_day02 Django的路由系统 URL配置(URLconf)就像Django所支撑网站的目录.它的本质是URL与要为该URL调用的视图函数之间的映射表. 1.URLconf配置 基本 ...

  4. MySQL--更新自增列的潜在风险

    ##=====================================================================##测试环境:MySQL版本:MySQL 5.7.19复制 ...

  5. python爬虫学习之正则表达式的基本使用

    一.正则表达式 1. 正则表达式是字符串处理的有力工具和技术. 2. 正则表达式使用某种预定义的模式去匹配一类具有共同特征的字符串,主要用于处理字符串,可以快速.准确地完成复杂的查找.替换等处理要求, ...

  6. 深入分析.NET应用程序SQL注入【危害】

    前言:   前面我们已经简单的剖析了一下.NET应用程序SQL注入.没有看过的朋友移步:http://bbs.ichunqiu.com/thread-7636-1-1.html,在上一篇文章我们已经了 ...

  7. CentOS7设置固定IP

    在安装完CentOS7后,当我每次启动CentOS并使用SecureCRT链接时,都发现CentOS的IP总是在变,这就很苦恼了,总不能每次链接的时候都先查一下虚拟机的IP吧,所以打算把它设置成固定I ...

  8. 小程序上传wx.uploadFile - 小程序请假

    小程序上传wx.uploadFile UploadTask wx.uploadFile(Object object) 将本地资源上传到服务器.客户端发起一个 HTTPS POST 请求,其中 cont ...

  9. 《http权威指南》读书笔记10

    概述 最近对http很感兴趣,于是开始看<http权威指南>.别人都说这本书有点老了,而且内容太多.我个人觉得这本书写的太好了,非常长知识,让你知道关于http的很多概念,不仅告诉你怎么做 ...

  10. fixed Oracle SQL报错 #ORA-01460: 转换请求无法实施或不合理

    最近遇到一个oracle错误,之前并没有遇到过,并不是select in超过1000个导致的,通过网上资料说是oracle版本导致,也有的说是oracle SQL过长导致. 然后通过自己实践应该说是o ...