异步向ListBox添加项目

时间:2013-01-16 23:14:30

标签: c# webforms asp.net-ajax updatepanel

我正在努力将项目添加到ListBox uxSearchList。但是,即使后面的代码按预期工作,单击uxSearchList后更改也不会反映在Search ListBox中。

我执行以下操作:

  • 输入搜索条件(uxEsnCheck/TextuxLocationList/Text
  • 点击Search
  • (正在进行中)将搜索结果填充到uxSearchList

如何通过我目前拥有的uxSearchList ListBox填充?我的代码如下。


.ASPX.CS

    protected void uxSearchParams_Click(object sender, EventArgs e)
    {
        uxSearchList.Items.Clear();

        var selectedSerial = uxEsnText.Text;
        var selectedLocation = uxLocationList.Text;

        if (!uxEsnText.Enabled)
        {
            selectedSerial = string.Empty;
        }
        if (!uxLocationList.Enabled)
        {
            selectedLocation = string.Empty;
        }

        if (Page.IsValid)
        {
            var selectedParams = _presenter.OnSelectionParams(selectedSerial, selectedLocation);

            foreach (var param in selectedParams)
            {
                uxSearchList.Items.Add(param.SerialNumber);
            }
        }
    }

.ASPX

        <asp:UpdatePanel ID="uxParamsPanel" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:CheckBox ID="uxEsnCheck" runat="server" CssClass="form-label" Text="Engine Serial Number" OnCheckedChanged="uxEsnCheck_CheckedChanged" AutoPostBack="true" />
                <asp:TextBox ID="uxEsnText" runat="server" Enabled="False"/>

                <asp:CheckBox ID="uxLocationCheck" runat="server" CssClass="form-label" Text="Location" OnCheckedChanged="uxLocationCheck_CheckedChanged" AutoPostBack="true" />
                <asp:DropDownList ID="uxLocationList" runat="server" Enabled="False"/>

                <asp:Button ID="uxSearchParams" runat="server" onclick="uxSearchParams_Click" CssClass="form-label" Text="Search" />
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="uxSearchParams" EventName="Click" />

                <asp:AsyncPostBackTrigger ControlID="uxEsnCheck" EventName="CheckedChanged" />
                <asp:AsyncPostBackTrigger ControlID="uxLocationCheck" EventName="CheckedChanged" />
            </Triggers>
        </asp:UpdatePanel>

        <asp:UpdatePanel ID="uxSelectionPanel" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:Label ID="uxSearchDisplay" runat="server" CssClass="form-label" Text="Search Results" />
                <asp:ListBox ID="uxSearchList" runat="server" Width="250px" />

                <asp:Label ID="uxMemberDisplay" runat="server" CssClass="form-label" Text="Engine Group Members" />
                <asp:ListBox ID="uxMemberList" runat="server" Width="250px" />

                <asp:Button ID="uxAdd" runat="server" onclick="uxAdd_Click" Text=">" />
                <asp:Button ID="uxRemove" runat="server" onclick="uxRemove_Click" Text="<" />
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="uxAdd" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="uxRemove" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>

2 个答案:

答案 0 :(得分:0)

当您单击搜索时,您正在更新服务器端的列表。您需要为客户端提供更新的方法。我看到uxSearchList在UpdatePanel中。我对这些并不太好,但我会尝试为此添加额外的触发器。这样,当uxSearchList的内容发生变化时,面向客户端的显示也会更新。

答案 1 :(得分:0)

使用数据绑定方法可能会有更好的结果。使用以下课程,我能够正确显示结果。

using System;
using System.Collections.Generic;

namespace Test.Web
{
    public partial class Test : System.Web.UI.Page
    {
        private readonly IList<string> database;
        private string currentSearch;

        public Test()
        {
            database = new List<string>();
            database.Add("hello");
            database.Add("world");
        }

        protected override void OnInit(EventArgs e)
        {
            base.OnInit(e);
            uxSearchList.DataBinding += dataBindSearch;
        }

        protected void OnSearch(object sender, EventArgs e)
        {
            currentSearch = searchText.Text;
            uxSearchList.DataBind();
        }

        private void dataBindSearch(object sender, EventArgs e)
        {
            IList<string> results = new List<string>();
            foreach (string item in database)
            {
                if (item.StartsWith(currentSearch))
                {
                    results.Add(item);
                }
            }
            uxSearchList.DataSource = results;
        }
    }
}

主要区别在于我使用DataSource而不是Items集合,并在搜索查询发生变化时在列表中调用DataBind。

如果此更改对您不起作用,则标记可能会出现另一个问题。我只是绑定了OnTextChanged事件,但仅此而已。

<div>
    <asp:TextBox ID="searchText" OnTextChanged="OnSearch" AutoPostBack="true" runat="server" />
    <asp:UpdatePanel ID="uxSelectionPanel" runat="server">
        <ContentTemplate>
            <asp:Label ID="uxSearchDisplay" runat="server" CssClass="form-label" Text="Search Results" />
            <asp:ListBox ID="uxSearchList" runat="server" Width="250px" />
        </ContentTemplate>
    </asp:UpdatePanel>
</div>