offset window scoll location on errors about live-form-validation

[mcbmcb0]

well that's easy:

var LiveForm = {
	options: { //existing 
		// vetical screen offset in px for element with error that receives focus after validation. Used when fixed navbar menu which may otherwise obscure the element in focus
		focusScreenOffset: 100, 
...

elem.focus(); //existing 
if(elem.getBoundingClientRect().top < LiveForm.options.focusScreenOffset){/
	window.scrollBy (0, elem.getBoundingClientRect().top - LiveForm.options.focusScreenOffset);
}

what do you think?

[Robyer]

Focusing the element (on master branch) is done here: https://github.com/Robyer/nette-live-form-validation/blob/master/live-form-validation.js#L705 So yes, you found same line in v1.8.1.

But I don't know how is this usually solved. Browser itself handles scrolling to that element, so you need to either override the browser's default behavior somehow (if that's possible) or scroll manually your +100px lower after the above mentioned line.

Is your scrollTo method working? Also, I think you should scoll only when the item isn't visible on the page already - so maybe remember scroll position, then call focus, then get new scroll position, and if it changed, then scroll down additional 100px?

I don't have time for this, so you let me know when you find reliable solution for this problem. Thanks.

[mcbmcb0]

scrollto works fine for me (on FF), tho I'm not sure how cross browser compatible it is. good point about if the element is already in view - i'll look into it when i get some time

[mcbmcb0]

this works:

elem.focus(); //existing
if(elem.getBoundingClientRect().top < 100){
	window.scrollBy (0, elem.getBoundingClientRect().top - 100);
}

reportedly ie8 and above. i just need to figure out how to pass a default offset value from Liveform optons:[ ]

[Robyer]

Slighly changed and commited, thanks ;-)