如何在同一.aspx页面上使用两个更新面板

时间:2012-07-06 07:57:11

标签: c# asp.net triggers updatepanel

我在页面上有两个更新面板。我想在不同的条件下更新它们的两个条件。但我不知道为什么会发生这种情况。我已为两者指定了触发器,但没有帮助,下面是我的代码。

请让我知道我哪里错了。

实际上,当第一个更新面板中的selectedindexchange被触发时,有三个下拉列表,然后第二个更新面板的内容也会更新。

<asp:UpdatePanel ID="upSearch" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
    <ContentTemplate>
        <div style="float: left; width: auto;">

            <asp:DropDownList ID="ddlLocation" runat="server" Width="206px" DataTextField="LocationName"
                DataValueField="Locationid" AutoPostBack="true" OnSelectedIndexChanged="ddlLocation_SelectedIndexChanged">
            </asp:DropDownList>

            &nbsp;
            <asp:DropDownList ID="ddlArea" runat="server" Width="200px" DataTextField="AreaName"
                DataValueField="Areaid" AutoPostBack="true" OnSelectedIndexChanged="ddlArea_SelectedIndexChanged">
            </asp:DropDownList>

            &nbsp;
            <asp:DropDownList ID="ddlRoom" runat="server" Width="200px" DataTextField="RoomName"
                DataValueField="Roomid">
            </asp:DropDownList>
            &nbsp;

        </div>
        <div style="float: left; width: 80px;">
            <asp:Button ID="btnSearch" runat="server" Text="Search" ValidationGroup="vgSearch"
                CssClass="bluebtn" UseSubmitBehavior="false" OnClick="btnSearch_Click" />
        </div>
        <div style="float: left; width: 99%; padding: 5px 0px;">
        </div>
    </ContentTemplate>
  </asp:UpdatePanel>

第二个如下: -

<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true" UpdateMode="Conditional">
<ContentTemplate>
    <asp:Calendar ID="calSchedule" runat="server" NextPrevFormat="FullMonth" OnDayRender="calSchedule_DayRender"
        OnVisibleMonthChanged="calSchedule_VisibleMonthChanged">
        <DayHeaderStyle CssClass="dayheaderStyle" />
        <NextPrevStyle />
        <OtherMonthDayStyle BackColor="#ffffff" />
        <SelectedDayStyle />
        <TitleStyle CssClass="titleStyle" />
        <TodayDayStyle BackColor="#ffffa0" ForeColor="#6699cc" />
        <WeekendDayStyle />
        <DayStyle CssClass="dayStyle" />
    </asp:Calendar>
</ContentTemplate>
<Triggers>
    <asp:AsyncPostBackTrigger ControlID="btnSearch" EventName="Click" />
</Triggers>
</asp:UpdatePanel>

4 个答案:

答案 0 :(得分:19)

首先,我想回忆一下UpdateMode

的用法
  • Always该小组将在页面上的每个帖子上更新其内容,它们可以是部分呈现帖子或完整帖子,在这两种情况下,面板的内容都将更新

  • Conditional只有在满足不同条件时才会更新面板内容:

    • 默认情况下,其子对象触发的事件会触发更新,您可以更改此行为设置ChildrenAsTriggers="false"

    • Triggers

    • UpdatePanel部分声明触发器时
    • 明确调用UpdatePanel.Update()方法

    • 整页帖子会触发更新

以下代码执行以下操作:

  • 每个UpdatePanel在其子控件引发事件时都会更新

  • 名为up1的UpdatePanel 1在其子控件引发事件时将更新

  • 名为up2的UpdatePanel 2将在其子控件引发事件时更新

  • 在触发定义的触发器时,也会更新名为up2的UpdatePanel 2,在这种情况下,当UpdatePanel 1上名为DropDownList的{​​{1}}触发{ {1}}

  • 当UpdatePanel 1上名为ddl1OnPanel1的{​​{1}}引发其SelectedIndexChanged时,名为up2的UpdatePanel 2也会更新,因为在代码中它显式调用:DropDownList

我认为调整此代码后,您可以实现所需的目标,只需将其粘贴到新页面并运行即可

检查以下代码(根据所引发的事件,查看显示日期的标签如何以不同方式受到影响):

代码背后

ddl2OnPanel1

ASPX

SelectedIndexChanged

简单输出

enter image description here

您可以更改UpdatePanel 2上的this.up2.Update();以查看差异,如果您这样做,此面板将在每个帖子上更新,包括来自UpdatePanel1的完整帖子或帖子

答案 1 :(得分:0)

如果您希望执行asyncpostback,请从DropdownLists中删除Autopostback =“True”。 此外,目前究竟出现了什么问题? updatepanels根本没有更新?

EDIT。同时删除childrenAsTriggers,因为此时不需要

答案 2 :(得分:0)

我成功地将其用于4个updatepanel。

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" EnableScriptGlobalization="true" CombineScripts="false" ScriptMode="Release">
</asp:ToolkitScriptManager>

答案 3 :(得分:-1)

如果您使用的是嵌套更新面板,请参阅以下示例代码:

<asp:UpdatePanel id="UpdatePanel1" UpdateMode="Conditional" runat="server">
            <ContentTemplate>
                <fieldset>
                <legend>Parent UpdatePanel</legend>
                Last refresh <%=DateTime.Now.ToString() %> <br />
                <asp:Button ID="Button1" runat="server" Text="Refresh Outer Panel" />
                <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                    <ContentTemplate>
                        <fieldset>
                        <legend>Nested UpdatePanel</legend>
                         Last refresh <%=DateTime.Now.ToString() %> <br />
                        <asp:Calendar ID="Calendar1" runat="server"></asp:Calendar>
                        </fieldset>
                    </ContentTemplate>
                </asp:UpdatePanel>
                </fieldset>
            </ContentTemplate>
        </asp:UpdatePanel>

如果不使用嵌套更新面板,请从代码的两个Updatepanel中删除“UpdateMode”条件。