jquery modal dialog scrolling to bottom

Hi,

I have this page:
https://secure.myultratrust.com/diy/login/create_username.php

If one clicks on the "Privacy Policy" and "Terms of Use" links at the bottom the modal dialog will scroll to the bottom. It's strange because if you first click on the "Privacy Policy" the modal dialog is at the top. But then when you click on "Terms of Use" the modal dialog scrolls to the bottom.

However, if you refresh and the first click "Terms of Use" the modal dialog opens at the top but then if you click on "Privacy Policy" the modal dialog scrolls to the bottom.

It just depends on what link you click on first.

Here is the code in the jquery plugin:

termsOfUseModal : function() {
            $( "#dialog:ui-dialog" ).dialog( "destroy" );

            $( "#terms_of_use" ).dialog({
                modal: true,
                width: 800,
                title: "Terms of Use: MyUltratrust.com",
                position: 'top',
                buttons: {
                    Ok: function() {
                        $( this ).dialog( "close" );
                    }
                }
            });

            var d = $(".ui-dialog").position();
            window.scrollTo( d.left , d.top);
        },

        /**
         * Display Privacy Policy onclick event.
         * Called from /form/includes/general/footer_entire.php by onclick()
         */
        privacyPolicyModal : function() {
            $( "#dialog:ui-dialog" ).dialog( "destroy" );

            $( "#privacy_policy" ).dialog({
                modal: true,
                width: 800,
                title: "Privacy Policy: MyUltratrust.com",
                position: 'top',
                buttons: {
                    Ok: function() {
                        $( this ).dialog( "close" );
                    }
                }
            });

            var d = $(".ui-dialog").position();
            window.scrollTo( d.left , d.top);
        },

Open in new window


Here are the links and the onclick calls on the .pi_general plugin:

Disclaimer: Communications between you and MyUltraTrust.com are protected by our <a onclick="$().pi_general('privacyPolicyModal');" class="terms_of_use">Privacy Policy</a> but not by the attorney-client privilege or as work product. MyUltraTrust.com provides access to independent attorneys and self-help services at your specific direction. We are not a law firm or a substitute for an attorney or law firm. We cannot provide any kind of advice, explanation, opinion, or recommendation about possible legal rights, remedies, defenses, options, selection of forms or strategies. Your access to the website is subject to our <a onclick="$().pi_general('termsOfUseModal');" class="terms_of_use">Terms of Use</a>. Vertex Management Group, LLC, Riverside Center, 275 Grove Street, Building 2, Suite 400, Newton, MA, 02466 is a registered and bonded legal document assistant.

Open in new window


How do I correct the code so the modal dialog always open at the top for both links?

Thank you<><
Victor KimuraSEO, Web DeveloperAsked:
Who is Participating?

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

x
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.

Julian HansenCommented:
What if you add the scrollTop to the Open?
        termsOfUseModal : function() {
            $( "#terms_of_use:ui-dialog" ).dialog( "destroy" );

            $( "#terms_of_use" ).dialog({
                modal: true,
                width: 800,
                title: "Terms of Use: MyUltratrust.com",
                position: 'top',
                buttons: {
                    Ok: function() {
                        $( this ).dialog( "close" );
                    }
                },
        open: function () {
          $(this).scrollTop(0);
        }
            });

            var d = $(".ui-dialog").position();
            window.scrollTo( d.left , d.top);
        },

Open in new window

0
Victor KimuraSEO, Web DeveloperAuthor Commented:
Hi julianH,

Just tried it but that doesn't work. Any other suggestions?
0
Julian HansenCommented:
Yes - I made an error in my post - remove the windwo.scrollTo at the bottom i.e.
        termsOfUseModal : function() {
            $( "#terms_of_use:ui-dialog" ).dialog( "destroy" );

            $( "#terms_of_use" ).dialog({
                modal: true,
                width: 800,
                title: "Terms of Use: MyUltratrust.com",
                position: 'top',
                buttons: {
                    Ok: function() {
                        $( this ).dialog( "close" );
                    }
                },
                open: function () {
                  $(this).scrollTop(0);
                }
            });

        },

Open in new window

0
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

Victor KimuraSEO, Web DeveloperAuthor Commented:
Hi julianH,

No, unfortunately that didn't work either.

https://secure.myultratrust.com/diy/login/create_username.php
0
Julian HansenCommented:
According to the comment here (3rd answer) the button is the cause - by adding a

$( "#terms_of_use:ui-dialog" ).focus( )

Open in new window


Claims after opening the dialog should fix the problem.
0
Victor KimuraSEO, Web DeveloperAuthor Commented:
Hi julianH,

thanks for the link. I tried to fix it but for some reason that's not working either. So I just decided to use fancybox and that seems to work. Hopefully, jquery will fix this bug sometime in the future.
0

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
Victor KimuraSEO, Web DeveloperAuthor Commented:
Using a jquery fancybox plugin worked for me. I think it's a jQuery bug but don't have time to find out the solution right now. =(
0
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
jQuery

From novice to tech pro — start learning today.