更新面板中的Modalpopup扩展程序,它控制不触发的事件

本文关键字:控制 事件 程序 Modalpopup 扩展 更新 | 更新日期: 2023-09-27 18:21:34

我知道这与S.O.上的许多其他问题类似,但它们似乎都不适用于这种情况,也不能解决问题。问题是我有一个模式弹出控件,我根据需要将其他控件传递到其中。因此,当用户在我的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);
    }

谢谢你的帮助。

更新面板中的Modalpopup扩展程序,它控制不触发的事件

不知道代码的其余部分。我在这里冒着险说:当然不行。

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

也就是说:你为什么这么做?为什么不简单地使用两个不同的ModalPopupExtender?它本身就是一头野兽,即使不诉诸这种诡计。

虽然这可能不是我通过尝试复制我们的web windows产品的流程和风格来处理自己创建的情况的"正确"方法,但我确实找到了一种方法来解决在模式弹出窗口中显示时无法从该控件触发事件的问题;尽管是迂回的。首先,我用javascript编写了一个函数,该函数完成了我本应放入控件事件中的大部分数学运算;从本质上讲,它计算从现在到特定日期之间剩余的学习时间,考虑到用户选择的学习日。然后,我通过使用web方法将保存的信息传递到数据库。

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();
}

正如我所说,这并不理想,但它是有效的。