js绑定下拉框
---恢复内容开始---
方法一
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绑定下拉框的更多相关文章
- js绑定下拉框数据源
··· buildRule:function (ruleId) { var ruleList = internal.ruleList; if(ruleList){ var programme_sel= ...
- JS模拟下拉框select
最近做的一个项目有下拉框 同事都是用的是美化控件,但是用美化控件当然是好 但是网上找的一个控件不知道扩展性怎么样?对以后的维护会不会造成有影响?比如我想增加一个功能或者减少一个功能会不会影响?还有就是 ...
- Js获取下拉框选定项的值和文本
Js获取下拉框的值和文本网上提供了2种方法:但有些人很不负责任,他们根本没考虑到浏览器之间的差异导致的错误,导致很多新手琢磨了半天找不出错误! 下面我总结下Firefox和IE下获取下拉框选定项的值和 ...
- WPF AutoGeneratingColumn 绑定下拉框
WPF自动产生列,前台代码: <DataGrid x:Name="Dg" AutoGenerateColumns="True" CanUserAddRow ...
- js改变下拉框内容
js改变下拉框内容 CreateTime--2018年4月8日18:47:38 Author:Marydon 适用场景:通常情况下,级联菜单.通过ajax异步获取后台数据改写下拉框内容会有这种需求 ...
- 奥展项目笔记07--vue绑定下拉框和checkbox总结
1.vue绑定下拉框 <div class="col-md-1 data"> <select class="form-control " v- ...
- JS 实现下拉框去重
JS 实现下拉框去重 学习内容: 需求 总结: 学习内容: 需求 用 JS 下拉框去重 实现代码 <html> <head> <meta http-equiv=" ...
- JS 实现下拉框回显
JS 实现下拉框回显 学习内容: 需求 总结: 学习内容: 需求 用 JS 实现下拉框回显 实现代码 <!DOCTYPE html> <html lang="en" ...
- jquery easyui无法绑定下拉框内容
最近在研究jquery easyui的DataGrid,发现DataGrid中的下拉框无法绑定值,找了很久也没发现是具体问题所在,最后还是同事帮忙搞定的.具体问题竟然是jquery easyui提供的 ...
随机推荐
- android-音量管理
推荐简书夕月风: 前两个主要设计音频建设置流程. 一.https://www.jianshu.com/p/a48fc2c830da 二.https://www.jianshu.com/p/892761 ...
- android-基础编程-ViewPager
ViewPager android 提供的基础V4包,android studio 导入gradle compile 'com.android.support:support-v4:25.0.0' 1 ...
- openXML写Excel列组合
重要代码: DOS.SheetData sheetData = new DOS.SheetData(); DOS.Columns columns = new DOS.Columns(); DOS.Co ...
- 手机端-万种bt在线观看器,安卓正版下载
安卓正版下载, 点击下载 无广告,完全免费!寻找任何你想要的资源!
- CentOS7 安装配置rsync
centos7自带rsync,今天简单记录下. rsync安装配置步骤 服务器端: 1.修改默认配置文件/etc/rsyncd.conf,该成如下: # /etc/rsyncd: configurat ...
- c++实现对windwos 下socket 的封装(实现封包及拆包处理)
SuperSocket.h #pragma once #include<string> #include<iostream> #include <WINSOCK2.H&g ...
- QEMU KVM libvirt 手册(1): 安装
安装 对虚拟化的支持通常在BIOS中是禁掉的,必须开启才可以. 对于Intel CPU,我们可以通过下面的命令查看是否支持虚拟化. # grep "vmx" /proc/cpuin ...
- 解析.NET对象的跨应用程序域访问(上篇)
在目前的项目开发中,分布式开发已经逐渐成为主流.一个项目要是没有采用分布式架构,都不好意思跟别人说这是一个完整的项目.这句话虽然有些过激,但是随着人们对效率的要求在提高,以及产品需要提升用户体验.只有 ...
- MySQL--自增列学习
##=====================================================================================## 在数据库表设计中会纠 ...
- SQL Server 深入解析索引存储(非聚集索引)
标签:SQL SERVER/MSSQL SERVER/数据库/DBA/索引体系结构/非聚集索引 概述 非聚集索引与聚集索引具有相同的 B 树结构,它们之间的显著差别在于以下两点: 基础表的数据行不按非 ...