Question

我有一个带有ajax modalpopup控件的aspx页面。当我在modalpopup中点击按钮时，我需要更新页面上的updatepanel内部的内容（不在modalpopup内）。

因此，我可以在更新面板内显示更改，而无需刷新整页。我已经尝试在按钮单击事件后面的代码中使用UpdatePanel.Update（）方法。但它没有任何作用。

我现在正在做的是在按钮点击事件中刷新整页。

无论如何，我可以更新更新面板以显示更改吗？

更新：这是相关aspx页面中的代码片段。

<div style="width: 400px; height: 200px; float: right;">
            <br />
            <asp:UpdatePanel ID="UpdatePanel5" runat="server" UpdateModel="Conditional">
                <ContentTemplate>
                    <asp:Label ID="lblDate" runat="server"></asp:Label>
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="btnGetSelectedDate" />
                </Triggers>
            </asp:UpdatePanel>                
        </div>

        <ajaxToolkit:ModalPopupExtender ID="mpeUpcomingDaysOff" runat="server" PopupControlID="panelUpcomingDaysOff" BackgroundCssClass="modalBackground" DropShadow="true" Enabled="True" TargetControlID="btnChangeUpcomingDaysoff" OkControlID="btnGetSelectedDate" CancelControlID="btnUpcomingDaysOffCancel" OnOkScript="window.top.location.reload();">
        </ajaxToolkit:ModalPopupExtender>
        <asp:Panel ID="panelUpcomingDaysOff" runat="server" Height="400" Width="700" BackColor="White" Style="border-radius: 5px">
            <div style="height: 50px; width: 700px; padding-left: 100px; font-family: Verdana; padding-top: 5px">
                <div>
                    <span style="font-weight: bold">Upcoming Daysoff for
                        <asp:Label ID="lblProviderNameDaysOff" runat="server"></asp:Label></span><br />
                    <span style="font-size: 12px">Select vacation and any other days when this service provider will not be available for online appointments.</span>
                </div>
                <div style="height: 300px; padding-left: 150px">
                    <asp:UpdatePanel ID="UpdatePanel4" runat="server">
                        <ContentTemplate>                           
                            <asp:Calendar ID="Calendar1" runat="server" BackColor="White" BorderColor="Black"
                                Font-Names="Verdana" Font-Size="9pt" ForeColor="Black" Height="250px" OnPreRender="Calendar1_PreRender" Width="330px"
                                OnSelectionChanged="Calendar1_SelectionChanged" OnLoad="Calendar1_Load" BorderStyle="Solid" CellSpacing="1" NextPrevFormat="ShortMonth">
                                <DayHeaderStyle Font-Bold="True"
                                    Height="8pt" Font-Size="8pt" ForeColor="#333333" />
                                <DayStyle BackColor="#CCCCCC"></DayStyle>

                                <NextPrevStyle Font-Size="8pt" ForeColor="White" Font-Bold="True" />
                                <OtherMonthDayStyle ForeColor="#999999" />
                                <SelectedDayStyle BackColor="#333399" ForeColor="White" />

                                <TitleStyle BackColor="#333399" Font-Bold="True"
                                    Font-Size="12pt" ForeColor="White" BorderStyle="Solid" Height="12pt" />
                                <TodayDayStyle BackColor="#999999" ForeColor="White" />
                            </asp:Calendar>
                    <br />
                    <asp:Button ID="btnGetSelectedDate" runat="server" Text="OK" OnClick="btnGetSelectedDate_Click" />
                    <asp:Button ID="btnUpcomingDaysOffCancel" runat="server" Text="Cancel" />
                    </ContentTemplate>
                    </asp:UpdatePanel>
                </div>

Answer 1

在您希望更新的更新面板中，您需要将模态div的按钮声明为异步回发触发器。

<asp:UpdatePanel ID="upPanel" runat="server" UpdateModel="Conditional">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Id_Of_Button_In_ModalDiv" />
    </Triggers>
    <ContentTemplate>
        ....
    </ContentTemplate>
</asp:UpdatePanel>

请记住，您的模态div不应该是更新面板的一部分。如果是，它将在回调后消失，因为ContentTemplate中的所有内容都将被服务器中的内容替换。

从ajax modalpopup中更新updatepanel

1 个答案: