2012-01-27 79 views
1

我知道這與S.O.上的許多其他問題類似。但他們似乎都不適用於這種情況,他們也沒有解決問題。問題是我有一個Modal Popup Control,我根據需要傳遞其他控件。所以當用戶點擊我的用戶界面上的一個按鈕時,他可以用一組內容獲取該模式,然後當點擊另一個按鈕時他會得到不同的內容。一切工作正常,直到我試圖從添加到模式彈出窗口的內容中觸發事件。說我已經盡力解決這個問題並不完全準確,但我已經嘗試了很多。我越來越相信這要麼不能完成,要麼我有一些錯誤的設置。更新面板中的Modalpopup擴展器,誰控制不會觸發的事件

這是此代碼爲更新面板

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

謝謝你的幫助。

回答

0

雖然這可能不是「正確」的方式來處理我自己創造的情況,試圖將我們的Windows產品的流程和樣式複製到網絡上,但我確實找到了解決問題的方法在模式彈出窗口中顯示的事件不會從此控件中觸發;儘管以迂迴的方式。 首先,我在javascript中編寫了一個函數,該函數完成了我將要放入控件事件中的大部分數學運算;本質上它會計算從現在到特定日期之間剩餘的學習時間,考慮用戶選擇爲研究日的一週中的幾天。然後通過使用webmethod將我保存的信息傳遞給數據庫。

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

就像我說的那樣不理想,但它的工作原理。

2

不知道其餘的代碼。我在這裏遇到一個肢體並說:Ofcourse它不會工作:P。

當您執行回發時,您需要重新創建page_init事件中佔位符中的控件。這樣,您可以在視圖狀態和控制處理程序分配之前重新創建控件集合。但是,如果不知道代碼的其餘部分,那只是一個猜測。

那就說:你爲什麼這樣做?爲什麼不簡單使用2種不同的ModalPopupExtender?即使不採用這種欺騙手段,它本身也是一種野獸。

+0

我不想創建30個左右獨立的模式彈出窗口,彈出窗口在那裏試圖模仿我們的Windows軟件。我沒有試圖用欺騙手段,只是一遍又一遍地複製同樣的基本事物似乎很愚蠢。這就是說我可能不得不復制粘貼它。 – Siegeon 2012-01-27 22:05:55

+0

然後,我真的在做這些東西(我幾乎沒有任何Web開發經驗)。沒有其他代碼可以顯示你真的... – Siegeon 2012-01-27 22:08:42

+0

不知道你的用例是如何有這麼多的彈出窗口。但我已經使用FancyBox與IFrame模式加載單獨的頁面作爲彈出窗口取得巨大成功。如果需要,您也可以從彈出窗口回到主頁面。這可能會更容易,那麼你現在想做什麼.... – Danthar 2012-01-27 22:11:28

相關問題