Link to home
Start Free TrialLog in
Avatar of treanor99
treanor99

asked on

Modal Popup Extender Scrolling Problem

I am using a modal popup extender to show part of my web page as a popup. When the web page is at the top the popup looks fine, it appears in the middle of the page and can be dragged around the page with the drag handle.

When the grid view on the page shows more records, obviously this means the user must scroll down the page to see other records. This is where the problem starts.

If the popup is visible and the page is scrolled down the popup over takes the page and disappears off the bottom of the page.

If the user has already scrolled down the page then when the popup is triggered it will already off the bottom of the page only to be seen again when scrolled up.

I can half solve this by changing the reposition mode to RepositionOnWindowResize, this has the effect of when the user is at the top of the page and scrolls down the popup stays in place, but if the user has scrolled to the bottom of the page and triggers the popup it doesn't appear at all.

Avatar of David Robitaille
David Robitaille
Flag of Canada image

Avatar of treanor99
treanor99

ASKER

Sorry I don't think I was clear enough.

The size of the popup is fine, its just that when the page is scrolled down the popup moves down the screen, not because it get's to big.

popup-scroll-issue.jpg
could i see your modal popup extender`s definition and `the CSS class you are applying on it.
 also try to set RepositionMode to RepositionOnWindowResizeAndScroll
<cc1:ModalPopupExtender ID="MPEPopupPaper" runat="server" BackgroundCssClass="modalBackground"
                                    PopupControlID="panelPopPaperStatus" PopupDragHandleControlID="panelPopupPaperStatusDrag"
                                    TargetControlID="HLMessagePaper" DropShadow="True">
                  </cc1:ModalPopupExtender>

.modalPopup {
      background-color:#ffffdd;
      border-width:3px;
      border-style:solid;
      border-color:Gray;
      padding:3px;
      width:250px;
      position:absolute;
}

I've already tried all the different Reposition modes. One kind of works but only if the popup starts at the top of the page, not if it's scrolled down.
ASKER CERTIFIED SOLUTION
Avatar of David Robitaille
David Robitaille
Flag of Canada image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Nice one davrob, it was the drag handle, as soon as I took that off it started scrolling fine no matter where on the page I was :o)

The handle was just a nice to have so problem solved... kinda.

Thank you!
ok, I made a quick search and i foud that.
http://forums.asp.net/p/1464773/3376483.aspx
So the page`s css is affecting the popup when PopupDragHandleControlID is set.
As far as I understand, it try to place the popup relative to where it`s placed on the page (because the user could move it). If ther is no DragHandle, it could center it on the page.
It seems to be a common problem with AJAX and stuff interfering with it! Or maybe it's just me!

At least I know where to look if I ever actually need the drag option.

Thanks again mate!