带有日历的弹出页面答案

【问题标题】：Popup page with Calendar带有日历的弹出页面
【发布时间】：2014-09-27 17:59:40
【问题描述】：

我在弹出页面中有日历，所以当我选择日期时它是隐藏的.

             <asp:TextBox ID="txtEndDate" runat="server" ReadOnly="true"></asp:TextBox>
                    <asp:ImageButton ID="imgEndDate" runat="server" ImageUrl="~/Images/Calendar.png"
                        OnClick="imgEndDate_Click" Width="28px" Height="28px" ImageAlign="AbsMiddle" />
                    <asp:Panel ID="pnlEndCalendar" runat="server" BorderColor="Black" BackColor="White"
                        Height="250px" Width="330px" HorizontalAlign="Center">
                        <asp:Calendar ID="calEndDate" runat="server" BackColor="White" BorderColor="Black"
                            BorderStyle="Solid" CellSpacing="1" Font-Names="Verdana" Font-Size="9pt" ForeColor="Black"
                            Height="250px" NextPrevFormat="ShortMonth" Width="330px" OnSelectionChanged="calEndDate_SelectionChanged">
                            <DayHeaderStyle Font-Bold="True" Font-Size="8pt" ForeColor="#333333" Height="8pt" />
                            <DayStyle BackColor="#CCCCCC" />
                            <NextPrevStyle Font-Bold="True" Font-Size="8pt" ForeColor="White" />
                            <OtherMonthDayStyle ForeColor="#999999" />
                            <SelectedDayStyle BackColor="#333399" ForeColor="White" />
                            <TitleStyle BackColor="#333399" BorderStyle="Solid" Font-Bold="True" Font-Size="12pt"
                                ForeColor="White" Height="12pt" />
                            <TodayDayStyle BackColor="#999999" ForeColor="White" />
                        </asp:Calendar>
                    </asp:Panel>
                    <ajax:ModalPopupExtender ID="ModalPopupExtenderEndDate" runat="server" TargetControlID="imgEndDate"
                        PopupControlID="pnlEndCalendar" BackgroundCssClass="modalBackground">
                    </ajax:ModalPopupExtender>

【问题讨论】：

请发布一些示例代码。
我贴出源代码。如果知道我检查按的是月份还是日期？
@user3544536 当您更改月历控件时执行回发和 modalpopupextender 关闭弹出窗口，因此如果您将日历包装在更新面板中，问题可能会得到解决
更新面板中的所有页面。
@user3544536 将日历包装在单独的更新面板中

标签： c# asp.net

【解决方案1】：

asp:Calendar 是实现IPostBackEventHandler 的服务器端控件，因此来自该控件的事件发送回发。

当您更改月份时 - 引发事件 VisibleMonthChanged 并发送回发。

发送回发时 - 父 UpdatePanel 更新它的内容，所以 ModalPopupExtender 隐藏弹出窗口。

为了解决问题，您需要在 UpdatePanel 中包装日历并为 main UpdatePanel 设置触发器，或者在您的 Calendar.OnSelectionChanged 处理程序中手动更新 main UpdatePanel。

所以你需要像这样改变你的标记

....
<UpdatePanel ID="main" UpdateMode="Conditional">
    <ContentTemplate>
    ....
        <asp:TextBox ID="txtEndDate" runat="server" ReadOnly="true"></asp:TextBox>
        <asp:ImageButton ID="imgEndDate" ... />
        <asp:Panel ID="pnlEndCalendar" runat="server" ...>
            <UpdatePanel runat="server">
                <ContentTemplate>                
                    <asp:Calendar ID="calEndDate" runat="server"
                                  OnSelectionChanged="calEndDate_SelectionChanged" ...>
                        ....
                    </asp:Calendar>
                </ContentTemplate>
            </UpdatePanel>
        </asp:Panel>
        <ajax:ModalPopupExtender ID="ModalPopupExtenderEndDate" runat="server" TargetControlID="imgEndDate" PopupControlID="pnlEndCalendar" ...>
                </ajax:ModalPopupExtender>
    ....
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="calEndDate" EventName="selectionchanged" />
    </Triggers>
</UpdatePanel>

MainUpdatePanel 是所有页面的 UpdatePanel

【讨论】：

非常感谢你很棒:)