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

方法一

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. 0x66 Tarjan算法与无向图连通性（1）

    ……是什么? 给定无向连通图G=(V,E)(不一定连通); 割点:若对于x∈V,从图中删去节点x以及所有与x关联的边后,G分裂成两个或两个以上不相连的子图,则称x为G的割点. 桥(割边):若对于e∈E ...

  2. Product and Sum in Category Theory

    Even if you are not a functional programmer, the notion of product type should be familiar to you, e ...

  3. 背水一战 Windows 10 (97) - 选取器: CachedFileUpdater

    [源码下载] 背水一战 Windows 10 (97) - 选取器: CachedFileUpdater 作者:webabcd 介绍背水一战 Windows 10 之 选取器 CachedFileUp ...

  4. Dubbo 源码分析 - 集群容错之 Cluster

    1.简介 为了避免单点故障,现在的应用至少会部署在两台服务器上.对于一些负载比较高的服务,会部署更多台服务器.这样,同一环境下的服务提供者数量会大于1.对于服务消费者来说,同一环境下出现了多个服务提供 ...

  5. Android 9.0/P 版本推荐使用 HttpURLConnection

    早在几年前,谷歌就推荐在Android2.3版本以上使用HttpURLConnection,而在即将正式发布的 Android P 版本中,谷歌彻底取消了对Apache HTTPClient的支持,针 ...

  6. 漫谈PHP组件、框架、Composer那些事

    什么是组件 组件是一组打包的代码,是一系列相关的类.接口和Trait,用于帮助我们解决PHP应用中某个具体问题.例如,你的PHP应用需要收发HTTP请求,可以使用现成的组件如guzzle/guzzle ...

  7. PDF 报表 Java 组件 iText5 中的单位注意事项

    这里面涉及到这几个单位: 点(磅)(pt).像素(px).英寸(inch).毫米(mm) 分辨率单位有: dpi(点每英寸):出现于打印或印刷领域. lpi (线每英寸):描述光学分辨率的尺度. pp ...

  8. 第三节：带你详解Java的操作符，控制流程以及数组

    前言 大家好,给大家带来带你详解Java的操作符,控制流程以及数组的概述,希望你们喜欢 操作符 算数操作符 一般的 +,-,*,/,还有两个自增 自减 ,以及一个取模 % 操作符. 这里的操作算法,一 ...

  9. Ubuntu 18.04基本配置

    允许WinSCP使用root连接 默认是不允许的,具体方法出自这里(传送门),修改ssh配置,在/etc/ssh下,修改sshd_config文件 PermitRootLogin yes 即可.默认不 ...

  10. HBase数据持久化之HRegion.flushcache即CF持久化

    我们从HRegion.flushcache开始分析.由于这个过程还是比较复杂的,因此,在这一节,我们不会分析的太过详细,只是单单的介绍一下其大体流程,待大家有了整体的把握之后,我们将在下一节详细介绍其 ...