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.

Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

David RobitailleAnalyst ProgrammerCommented:
treanor99Author Commented:
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.

David RobitailleAnalyst ProgrammerCommented:
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
OWASP: Forgery and Phishing

Learn the techniques to avoid forgery and phishing attacks and the types of attacks an application or network may face.

treanor99Author Commented:
<cc1:ModalPopupExtender ID="MPEPopupPaper" runat="server" BackgroundCssClass="modalBackground"
                                    PopupControlID="panelPopPaperStatus" PopupDragHandleControlID="panelPopupPaperStatusDrag"
                                    TargetControlID="HLMessagePaper" DropShadow="True">

.modalPopup {

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.
David RobitailleAnalyst ProgrammerCommented:
The problem coul be the container of the panel modalpopup. try to put it outside of any panel/ table/ ect.
you could also try to remove the PopupDragHandleControlID. i read somewhere it could cause problems.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
treanor99Author Commented:
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!
David RobitailleAnalyst ProgrammerCommented:
ok, I made a quick search and i foud that.
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.
treanor99Author Commented:
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!
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.