CODEWITHSUNDEEP
xpages
Bruce Stemplewski
Bruce Stemplewski

Reputation: 1343

How can I scroll the browser window?

I am validating my form using an extension pages dialog box. I popup the dialog box with the error message when the user needs to correct input.

The dialog box has an OK button that closes the dialog box and sets focus to the field that needs to be corrected.

 var ef = dojo.byId(errorField);
 ef.focus();

This is working great except......

I have a group of buttons and a bunch of other components that float to the top of the form.

They are inside a panel with the following CSS.

 .PNCToolBar2 {
position:fixed;
top:68px;
left:0px;
width:100%;
height:40px;
color:#fff;
background-color:#F2F2F2;
padding-top:6.0px;
padding-left:15.0px
 }

What is happening is that if the failing field is scrolled up under the "button bar" then the browser scrolls a bit to try to get the button into focus but not enough. Depending on how the user had their browser scrolled on the form, all or part of the field in error might still be hidden by the button bar.

Is there a way to first know if the field is at the top of the browser window under the bar and then scoll a bit if it is to make the field appear? If so how?

Upvotes: 1

Views: 513

Answers (2)

Tim Tripcony
Tim Tripcony

Reputation: 8086

Try:

dojo.window.scrollIntoView(ef);

If the DOM node represented by ef is not currently on the screen, Dojo will scroll just enough so that it will be.

More info on this method

Upvotes: 4

Thomas Adrian
Thomas Adrian

Reputation: 3636

using javascript you can use the scrollTo() method http://www.w3schools.com/jsref/met_win_scrollto.asp

Upvotes: 0

Related Questions