C#如何实现Textbox与dropdownlist无刷新联动

[merobin8]

Textbox输入用户id, dropdownlist检测到后，从数据库读取用户的所有保单编号并绑定。这个功能如何实现？

[还想懒够]

去查一下jQuery的ajax的使用，将文本框中的值传递到后台，后台返回后，再利用js对select控件执行赋值

[娃都会打酱油了]

如果是js的方式，你可以查下数据过滤，如果是服务器控件的话，那么设置textbox的autopostback为true，并用updatepanel包含这些控件

[abz7676]

给你一个textbox输入框模糊查询联动其他控件的例子，你可以参考一下： 1、引入脚本如下

<script type="text/javascript" src="Js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="Js/InputSearch.js"></script>

2、调用方法如下：

jQuery(function(){
        ShowSearchCreateOrderInfo();
                            });

           function ShowSearchCreateOrderInfo()
          {     
            ShowSearchInfo(jQuery('#输入框的控件Id'),{
                type:'search',
                url:'WebService2.asmx/GetCarBrandValue',
                condition:jQuery("#Hidden1").val(),
                NoAutoShow:true,
                othInfo:true,
                
                othClick:function(ele){
                    //设置联动
                    var arr=jQuery('#OTxtItem02').attr('othInfo').split('↑');
                    if(arr.length!=4)
                    {
                        alert('出错了');
                        return false;
                    }
                    jQuery('#下拉框的控件Id').val(arr[0]);                         
                }             
              });
           }

接下来就是写WebService2.asmx里面的GetCarBrandValue方法

public string GetCarBrandValue(string FieldInfo)
        { 
            string[] arr = Server.UrlDecode(FieldInfo).Trim('↑').Split('↑');
            if (arr.Length != 1)
            {
                return "传递参数有误";
            }
            string sql = "select   输入框控件所对应的数据库表字段名称,下拉框控件所对应的数据库表字段名称  from CarsInfo where   输入框控件所对应的数据库表字段 like '%" + arr[0] + "%' ";
            DataTable dt = rdtable(sql);
            StringBuilder strText = new StringBuilder();
            int count = Convert.ToInt32(arr[1]);
            int indexC = 0;
            if (dt.Rows.Count == 0)
            {
                return "没有相关数据";
            }
            string othInfo = "";
            foreach (DataRow dr in dt.Rows)
            {
                if (indexC < count)
                {
                    othInfo = dr["下拉框控件所对应的数据库表字段名称"].ToString().Trim() ;
                    strText.Append("<input type='input' style='border:0px;cursor:pointer; width:" + arr[2] + "' value='" + dr["输入框控件所对应的数据库表字段名称"].ToString().Trim() + "' othInfo='" + othInfo + "' rV='" + dr["输入框控件所对应的数据库表字段名称"].ToString().Trim() + "' class='inputSel001'/>");                   
                    indexC++;
                }
                else
                {
                    break;
                }
            }
            return strText.ToString();
        }

[abz7676]

我给你的这个参考例子是基于jQuery+WebService的方法实现的。 另外还有1个需要注意的地方： 写好的javascript的方法ShowSearchCreateOrderInfo，假如要加载的话，一定要把这个ShowSearchCreateOrderInfo方法放在 jQuery(function(){ }里面，切记！

[abz7676]

纠正一下我写的前台jQuery的一个方法：

jQuery(function(){
        ShowSearchCreateOrderInfo();
                            });

           function ShowSearchCreateOrderInfo()
          {     
            ShowSearchInfo(jQuery('#输入框的控件Id'),{
                type:'search',
                url:'WebService2.asmx/GetCarBrandValue',               
                NoAutoShow:true,
                othInfo:true,
                
                othClick:function(ele){
                    //设置联动
                    var arr=jQuery('#输入框的控件Id').attr('othInfo').split('↑');
                    if(arr.length!=1)
                    {
                        alert('出错了');
                        return false;
                    }
                    jQuery('#下拉框的控件Id').val(arr[0]);                         
                }             
              });
           }

[以专业开发人员为伍]

引用 楼主 merobin8 的回复:

Textbox输入用户id, dropdownlist检测到后

你的逻辑描述要基于深入一点点的编程知识，否则就无法把“谁是谁”给说对。 这里是“用户输入任何内容后”，而不是什么“dropdownlist 检测到后”。谁检测？是 textbox 触发 textchanged 事件，而你张冠李戴了。 至于说查询数据库绑定 dropdownlist 的例子，请随便找一本 asp.net 入门书，肯定都有。只要是讲到这个控件的应用就一定会写这样功能的代码。

[以专业开发人员为伍]

我给你写一个小例子说明“前端人员”如何编写页面

<%@ Page Language="C#"  %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>演示动态下载 json 内容文件并绑定到 select 元素</title>

    <%--首先要使用 Nuget 添加 knockoutjs、jquery 到你的工程--%>
    <script src="Scripts/knockout-3.4.0.js"></script>
    <script src="Scripts/jquery-1.9.1.min.js"></script>
</head>
<body>

    <select data-bind="options: myItems, attr: { size: height }, value: Selected">
    </select>
    <hr />
    请输入要下载的文件的名字（不含后缀）：
    <input type="text" data-bind="value: dataFileName" style="width: 90px;" />
    <hr />
    现在选中了：<span data-bind="text: Selected"></span>

    <script type="text/javascript">
        var viewmodel = function () {
            this.myItems = ko.observableArray([]);
            this.height = ko.computed(function () {
                return this.myItems().length > 4 ? 4 : this.myItems().length;
            }, this);
            this.dataFileName = ko.observable("names");
            this.Selected = ko.observable("");
            this.refresh = function () {
                var self = this;
                $.get("datademos/" + this.dataFileName() + ".txt", null, function (d) {
                    var all = JSON.parse(d);
                    self.myItems([]);
                    for (var i = 0; i < all.length; ++i)
                        self.myItems.push(all[i]);
                });
            };
            this.dataFileName.subscribe(function () {
                this.refresh();
            }, this);
            this.refresh();
        };
        ko.applyBindings(new viewmodel());
    </script>
</body>
</html>

这样一个页面，首先把默认的 <form runat="server"></form>删除掉了，接下来就是设计了页面的前端 viewmodel 类型，并且在页面加载时（最后一行代码）绑定一个 viewmodel 实例给页面。 你可以在网站的 datademos 目录下放两个文件，例如一个名为 names.txt，其内容为

[
	"张三",
	"李四",
	"王二麻子",
	"小2B"
]

另外再放一个abc.txt文件，内容类似（随便修改），然后运行这个页面。你可以看到，当你在文本框中录入了文件名，当焦点移开输入框的时候，就会动态下载新的数据文件。当然你也可以在输入时随时（autocompleted）调用执行 refresh 函数。 这是前端编程。 但是你现在如果只是会点 asp.net，不要胡乱写前端代码。我告诉你，asp.net 程序员如果胡乱自学点 javascript、jquery，那离真正开发前端商业化应用的距离就差太远了，那样反而要失业了（还不如先把 asp.net 服务器控件学好再说）。要学习好前端开发，你至少要掌握一种极高编程效率的mvvm或者mvc前端框架，不要用混乱的javascript、jquery代码去乱改dom对象。

[以专业开发人员为伍]

你在 webform、asp.net mvc 其实都学会了最基本的将界面模板与数据model相分离的编程设计思想。 如果你先现在胡乱学写 javascript、jQuery 编程，只写几行代码可以，但是无法登大雅之堂，无法成为一个要开发上万行 javascript代码（或者几千行 typescript代码）的项目的程序员。 我一直想不明白如何在 asp.net 论坛来回复说明那些需要比较多 js、jquery 代码的帖子的设计问题。因为 asp.net 程序员在 js 方面的底子太差了，又不走正规渠道，仅仅靠自学一些纯粹 javascript 的初级的编程。我一直不太敢在 asp.net 论坛中系统会回复任何前端编程设计问题，因为如果没有1、2种前端框架和新技术得到大家的共识，那么 asp.net 程序员做前端开发——必将失业。