By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
426,179 Members | 2,192 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 426,179 IT Pros & Developers. It's quick & easy.

Ajax ModalPopup panel just shows at bottom of the page

P: 1
i have been trying (and sometimes succeeding) to use the modalpopupextender to show various panels of controls on my asp pages. the strange problem that i keep on running into is that sometimes it works, displaying an awesome popup, while other times, it doesn't show a popup at all, but rather just page posts back and the panel becomes visible at the bottom of the page (where it is situated in the designer). what is even stranger to me is that in some instances, the popup works but a few days later i'll come back to find that it has stopped working.

i've been scouring forums, but have found no one who has had this same problem. one post mentioned control validators and on one of the pages where it stopped working after having previously worked, the only thing that i could see as having changed was that control validators were added. i commented out the validators though, and the problem persisted. i also use validators on all my pages, and on some pages, the popup works despite the validators.

in most cases, the panels, how they are called and their content are exactly the same from one page to the next. this is another strange factor: i've literally copied and pasted code from one page to another and it works on the first page, but not on the next. but then it will work on another one i paste the code onto.
this is a brief synopsis of how i've used the popups:
  • pages (which use a master page) have multiple panels and popup extenders
  • controls are inside an update panel, which on a panel, which is then on another panel (this was a suggestion i found when earlier trying to use update panels with the popup)
  • targetid of the mpe is set to a "dummy" button with style="display:none;"
  • .show() method of the extender is then called from the server side click event of a linkbutton (needed to do it like this because the linkbutton is inside a formview, and therefore cannot be directly used as a string name for the targetid...or can it?? at any rate, i didn't know how so i did it by adding an event handler to the linkbutton when the formview changes mode)

the popup shows modal when i show the "dummy" button and then click on that, but then when i close the popup, it displays at the bottom again, and that won't close when i click on the close button.

does anyone have any clues?? please help!!

Below are some code snippets that i thought were relevant. I don't mind posting everything, but it might be a bit of a monster post.
This is one of the pages that had worked before, but now doesn't seem to work anymore...

Expand|Select|Wrap|Line Numbers
  1. <%@ Page Language="vb" AutoEventWireup="false" MasterPageFile="~/Forms/Site.Master"
  2.     Codebehind="EventDetailEditForm.aspx.vb" Inherits="UberDB.Web.EventDetailEditForm"
  3.     Title="Untitled Page" %> 
  4.  <%@ Register Assembly="Validators" Namespace="Sample.Web.UI.Compatibility" TagPrefix="cc1" %>
  5. <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
  6. ...various other controls, some of which have control validators on them - i've changed these now to the "ajax friendly" validators, but it still doesn't work :(
  8. <asp:GridView ID="CalendarEventRemindersGridView" runat="server" AutoGenerateColumns="False"
  9.                                 CellPadding="4" ForeColor="#8E9275" GridLines="None" Width="100%" UseAccessibleHeader="true">
  10.                                 <FooterStyle BackColor="#DDEB93" Font-Bold="True" ForeColor="#669900" />
  11.                                 <Columns>
  12.                                   ...various other collumns, but the one that is important for the panel is this "edit" one: it displays an image button that gets clicked on to show the popup 
  13.                                     <asp:TemplateField>
  14.                                         <ItemTemplate>
  15.                                             <asp:ImageButton ID="EditReminderImageButton" runat="server" ImageUrl="~/Images/Edit.png"
  16.                                                 Height="20" Width="20" CommandName="Edit" CommandArgument='<%#GetReminderId(GetDataItem())%>'
  17.                                                 Visible='<%#GetReminderEditVisible(GetDataItem())%>' />
  18.                                         </ItemTemplate>
  19.                                     </asp:TemplateField>
  20.                                 </Columns>
  21.                                 <RowStyle BackColor="#DDEB93" />
  22.                                 <EditRowStyle BackColor="#2461BF" />
  23.                                 <SelectedRowStyle BackColor="#669900" Font-Bold="True" ForeColor="#333333" />
  24.                                 <PagerStyle BackColor="#DDEB93" ForeColor="669900" HorizontalAlign="Center" />
  25.                                 <HeaderStyle CssClass="GridStaticHeader" BackColor="#DDEB93" Font-Bold="True" ForeColor="#669900"
  26.                                     HorizontalAlign="Left" />
  27.                                 <AlternatingRowStyle BackColor="#EBF3BE" />
  28.                                 <EmptyDataTemplate>
  29.                                     There are no reminders for this event.
  30.                                 </EmptyDataTemplate>
  31.                             </asp:GridView> 
  33. <asp:Button ID="ModalPopupDummyButton" Text="dummy button" runat="server" />
  34.     <asp:Panel ID="Panel1" runat="server" Height="200px" Width="792px">
  35.         <asp:Panel ID="EditReminderPanel" runat="server" Height="112px" Width="728px" BackColor="#DDEB93"
  36.             BorderColor="#DDEB93" BorderStyle="Solid" BorderWidth="10px" Font-Bold="False">
  37.             <asp:UpdatePanel ID="UpdatePanel1" runat="server">
  38.                 <ContentTemplate>
  40.                    ...various controls... (NO validators on any of these controls)
  42.                 </ContentTemplate>
  43.             </asp:UpdatePanel>
  44.             <br />
  45.             <asp:Button ID="EditReminderButton" runat="server" Text="Save" />
  46.             <asp:Button ID="CancelEditButton" runat="server" Text="Cancel" />
  47.         </asp:Panel>
  48.         &nbsp;
  49.     </asp:Panel>
  50.     <ajaxToolkit:ModalPopupExtender ID="EditReminderModalPopupExtender" TargetControlID="ModalPopupDummyButton"
  51.         runat="server" PopupControlID="EditReminderPanel" BackgroundCssClass="modalPopupBackground"
  52.         DropShadow="true">
  53.     </ajaxToolkit:ModalPopupExtender> 

Then in the CODE BEHIND:
Expand|Select|Wrap|Line Numbers
  1.  Private Sub CalendarEventRemindersGridView_RowCommand(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCommandEventArgs) Handles CalendarEventRemindersGridView.RowCommand
  2.         If e.CommandName = "Edit" Then
  3.             Dim calendarEventReminder As New BusinessObjects.CalendarEventReminder
  4.             calendarEventReminder = BusinessObjects.CalendarEventReminder.Load(CInt(e.CommandArgument))
  6.             'set sessionstate to store id for saving edited info
  7.             Session.Add("CalendarEventReminderId", calendarEventReminder.EventReminderId)
  9.             'populate and show the relevant edit reminder popup
  10.             PopulateEditReminderPopup(calendarEventReminder)
  11.         End If
  12.     End Sub
  13.      Private Sub EditReminderButton_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles EditReminderButton.Click
  15.         'determine which radio button is checked in order to correctly populate the reminder object
  16.         If EditRadioButton.Checked = True Then
  17.             PopulateCalendarEventReminder(EventReminderTypeEditDropDownList, PersonTypeEditDropDownList, PersonEditDropDownList, ReminderEditDropDownList)
  18.         ElseIf Edit2RadioButton.Checked = True Then
  19.             PopulateCalendarEventReminder(EventReminderTypeEdit2DropDownList, PersonTypeEdit2DropDownList, PersonEdit2DropDownList, Nothing)
  20.         End If
  22.         'perform page validation
  23.         If Page.IsValid Then
  25.             'save reminder
  26.             If mCalendarEventReminder.IsValid Then
  27.                 mCalendarEventReminder.IsDeleted = 0
  28.                 mCalendarEventReminder.UpdateDate = Now
  29.                 mCalendarEventReminder.Save()
  30.             End If
  32.             'dispose of session variable holding id of reminder being edited
  33.             Session.Remove("CalendarEventReminderId")
  35.             EditReminderModalPopupExtender.Hide()
  36.             LoadRemindersGridView()
  37.         End If
  39.     End Sub
  41.     Private Sub CancelEditButton_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles CancelEditButton.Click
  42.         EditReminderModalPopupExtender.Hide()
  44.         'dispose of session variable holding id of reminder being edited
  45.         Session.Remove("CalendarEventReminderId")
  46.     End Sub

There are also some methods for populating the controls on the panel, and enabling and disabling them depending on selection of a radio button also on that panel.

I'd be really keen to find a solution - switching over to the popups was a drastic solution to problems i was having with another "popup" style window, and now its turning out to be just as problematic!!
Oct 1 '07 #1
Share this Question
Share on Google+
1 Reply

Expert Mod 15k+
P: 16,027
Welcome to TSDN!

Although it's an AJAX ModalPopup, you'll probably get more help with your problem in the .NET forum to which I've moved this thread (moved from JavaScript/AJAX forum).
Oct 1 '07 #2

Post your reply

Sign in to post your reply or Sign up for a free account.