更新面板中的 Modalpopup 扩展器，谁控制事件不触发

Question

我知道这与 SO 上的许多其他问题类似，但它们似乎都不适用于这种情况，也不能解决问题。问题是我有一个模态弹出控件，我根据需要将其他控件传递到其中。因此，当用户单击我的 UI 上的一个按钮时，他可以获得包含一组内容的模式，然后当单击另一个按钮时，他会获得不同的内容。一切都工作正常，直到我尝试从添加到模式弹出窗口的内容中触发事件。说我已经尝试了一切来解决这个问题并不完全准确，但我已经尝试了很多。我越来越确信这要么无法完成，要么我有一些错误的设置。

这是更新面板的代码

<input id="dummy" type="button" style="display: none" runat="server" />
<asp:ModalPopupExtender CancelControlID="Close" runat="server" ID="mpeThePopup" TargetControlID="dummy" PopupControlID="pnlModalPopUpPanel" BackgroundCssClass="modalBackground" PopupDragHandleControlID="Title" />
<asp:Panel ID="pnlModalPopUpPanel" runat="server" CssClass="modalPopup" Width="400px" Height="600px">
    <asp:UpdatePanel ID="udpInnerUpdatePanel" runat="Server">
        <ContentTemplate>
            <table id="ContentTableTag" runat="server" cellpadding="0" cellspacing="0" style="width: 100%;
                height: 100%;">
                <tr>
                    <td id="Title" runat="server" style="background-color: rgb(79,82,90); text-align: left;
                        height: 28px; width: 90%; color: White;" nowrap="nowrap">
                        <h4 style="margin: 0px 0px 0px 5px;">
                            <asp:Label ID="LblSectionTitle" runat="server" Text="Modal"></asp:Label>
                        </h4>
                    </td>
                    <td id="Close" runat="server" style="background-color: rgb(79,82,90); text-align: right;
                        height: 28px; width: 10%" nowrap="nowrap">
                        <asp:ImageButton ID="ibClose" runat="server" Style="margin-right: 5px;" ImageUrl="~/WLImages/MLS/button_close.png"
                            ToolTip="Close" />
                    </td>
                </tr>
                <tr>
                    <td id="MainContentHolder" colspan="2" align="left" style="top: 0px; bottom: 100%;
                        vertical-align: top; width: 100%; height: 100%" />
                </tr>
            </table>
        </ContentTemplate>
    </asp:UpdatePanel>
</asp:Panel>

这是我添加到模式弹出窗口的用户控件的代码，在其背景中有两个事件触发器，一个用于日历更改日期，另一个用于检查时开启框内的项目已被选中。

<table id="mainContent" runat="server" visible="false" width="350" height="300">
    <tr>
        <td>
            <asp:label ForeColor="White" runat="server" Text="Exam Date:" />
        </td>
        <td>
            <asp:TextBox ID="txtDate" runat="server" Width="127" ForeColor="Black" 
                readonly="true" ontextchanged="txtDate_TextChanged"/>
            <asp:CalendarExtender ID="CalendarExtender" runat="server" 
                PopupButtonID="ibtnCalendar" OnClientDateSelectionChanged="checkDate" 
                TargetControlID="txtDate" onload="LoadCalendar" />
        </td>
        <td>
            <asp:ImageButton ID="ibtnCalendar" ImageUrl="../imgs/btn_calendar.png" Width="20px" runat="server" />
        </td>
    </tr>
    <tr>
        <td style="vertical-align: top; padding-top:5px">
            <asp:label ForeColor="White" runat="server" Text="Study Days:" />
        </td>
        <td colspan="2" style="vertical-align: top; padding-top:5px">
            <asp:CheckBoxList ID="WeekCheckBox" runat="server" ForeColor="White" 
                onselectedindexchanged="WeekCheckBox_SelectedIndexChanged">
                <asp:ListItem Text="Monday" Value="1" />
                <asp:ListItem Text="Tuesday" Value="2" />
                <asp:ListItem Text="Wednesday" Value="3" />
                <asp:ListItem Text="Thursday" Value="4" />
                <asp:ListItem Text="Friday" Value="5" />
                <asp:ListItem Text="Saturday" Value="6" />
                <asp:ListItem Text="Sunday" Value="7" />
            </asp:CheckBoxList>
        </td>
    </tr>
    <tr>
        <td>
            <asp:label ForeColor="White" runat="server" Text="Study hours per day:" />
        </td>
        <td colspan="2">
            <asp:TextBox ForeColor="Black" ID="tbStudyHours" runat="server" Width="127px" ReadOnly="true" />
        </td>
    </tr>
</table>

最后，这就是我将控件附加到模态的方式。

private void GenerateCalendarPopup(ExamDateSelector eds)
    {
        pnlModalPopUpPanel.BackColor = GUI.Instance.GUIColorElement(GUIElements.color_main);
        LblSectionTitle.Text = "Exam Date";
        pnlModalPopUpPanel.Height = eds.ControlHeight + 40;
        pnlModalPopUpPanel.Width = eds.ControlWidth + 25;
        eds.ShowControl = true;
        MainContentHolder.Controls.Add(eds);
    }

感谢您的帮助。

Answer 1

不知道你的代码的其余部分。我在这里冒险说：当然这是行不通的：P。

当您执行回发时，您需要重新创建 page_init 事件中占位符中的控件。这样，您就可以在分配视图状态和控件处理程序之前重新创建控件集合。然而，在不知道代码的其余部分的情况下，这只是一个猜测。

那就是：你为什么要这样做？为什么不简单地使用 2 个不同的 ModalPopupExtender？即使不使用这种诡计，它本身就是一头野兽。

Answer 2

虽然这可能不是处理我通过尝试复制我们的 Windows 产品的 Web 流程和风格而为自己创建的情况的“正确”方法，但我确实找到了一种方法来解决事件不从此控件出现在模式弹出窗口中时；虽然是以一种迂回的方式。
首先，我用 javascript 编写了一个函数，该函数执行了我将在控件事件中放入的大部分数学运算；本质上，它会计算从现在到特定日期之间剩余的学习时间，并考虑用户选择的一周中的几天作为学习日。然后，我通过使用网络方法将保存的信息传递到数据库。

function calculateStudyTime() {
    //do some math
    …
    PageMethods.SaveModalExamDateChangesToDB(datesString, selectedDate);
}

我将脚本附加到我想要在代码隐藏中触发计算的每个控件。就我而言，当代表一周中的某一天的复选框被切换时，我想重新计算学习时间。所以我将脚本附加到 ListItem 控件。我这样做是因为 ListItem 控件实际上没有可通过设计器访问的 onclick 属性，但可以通过这种方式添加一个。

protected void LoadCalendar(object sender, EventArgs e)
{

   …
   foreach (ListItem item in WeekCheckBox.Items)
   {
      item.Attributes.Add("onclick", "calculateStudyTime()");
   }
      …
}

最后，在调用所有模式弹出窗口的基页中，我创建了对该基页的静态引用，以及要从 javascript 文件调用的修饰函数。需要对其自身的静态引用，以便我可以从静态 Web 方法访问基页（在本例中是我的上下文）的成员。

Static Dashboard thisPage;
protected void Page_Load(object sender, EventArgs e)
{
   …
   thisref = this;
   …
}

[WebMethod]
[ScriptMethod]
public static void SaveModalExamDateChangesToDB(string days, string date)
{
   thisPage.UserSession.UserCourse.ExamDate = DateTime.Parse(date);
   thisPage.UserSession.UserCourse.StudyDays = days;
   thisPage.UserSession.UserCourse.Save();
}

就像我说的，这并不理想，但它有效。