C#中的可编辑下拉列表

2023年2月5日 428次阅读

我需要创建一个下拉列表,用户可以从下拉列表中选择一个值或输入值.

完全像下面的链接中的“你来自哪里？”下拉列表：

http://www.dhtmlgoodies.com/scripts/form_widget_editable_select/form_widget_editable_select.html

我知道这是一个常见的问题,堆栈溢出也有类似的查询,但我找不到一个简单的工作解决方案.

我已经提到了以下链接：

http://www.codeproject.com/Articles/8578/Editable-Dropdown-DHTML-Behavior
http://www.codeproject.com/Articles/290218/Custom-ASP-NET-Editable-DropDownList
http://codeverge.com/asp.net.web-forms/editable-dropdown-list-c/392261

有没有人曾经做过这方面的工作,并让我知道如何进行？

最佳答案 另一种解决方案如下

您可以使用Ajax Control Toolkit Nuget

步骤1：
从引用中的Nuget包添加Ajax Control Toolkit

第2步：
如果没有将Ajax Control Toolkit控件添加到工具箱中,则需要创建一个单独的选项卡并将其命名为Ajax Toolkit Controls.
然后右键单击它并选择选择项目.
浏览到Ajax Control Toolkit的dll所在的位置,选择它.
您将看到一组控件填充到窗口中.
选择Ok,这将导致使用Ajax Control Toolkit控件填充选项卡.

第3步：
由于Ajax Toolkit控件是一个额外的附加软件包,因此您需要使用它们将它们注册为页面的一部分.如果作为nuget安装,则可以忽略此步骤.

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="ajaxToolkit" %>

注意：tagprefix应该与您在程序中用于AjaxControlToolkit控件的tagprefix相匹配.

第4步：
添加ScriptManager控件,它是为客户端AJAX功能提供支持所必需的.因此,它加载并注册Microsoft AJAX库以启用这些功能.

<asp:ScriptManager ID="ScriptManager1" runat="server" />

第5步：
继续从工具箱中添加ComboBox,并使用SQLDataSource将其链接到数据库进行配置

完整的源代码如下

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxComboboxSample.aspx.cs" Inherits="StacksEmptied.AjaxComboboxSample" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <style type="text/css">
        #ComboBox1_ComboBox1_OptionList {
            width: 10% !important;
        }
    </style>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server" />
            <ajaxToolkit:ComboBox ID="ComboBox1" AppendDataBoundItems="True" runat="server" AutoCompleteMode="Suggest" DataSourceID="SqlDataSource1" DataTextField="Fruits" DataValueField="Fruits" MaxLength="0" Style="display: inline;">
            </ajaxToolkit:ComboBox>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ConnectionStrings:FruitsConnectionString %>" SelectCommand="SELECT * FROM [Fruits]"></asp:SqlDataSource>
        </div>
    </form>
</body>
</html>

我已在以下所有设置测试环境中测试了此代码：
Chrome浏览器版本43.0.2334.0 dev-m(64位)
Internet Explorer 11
Firefox 36.0.1
Visual Studio 2013版

点赞