We use a 3rd part framework called AribaWeb where the UI HTML is rendered by backend server, but javascript is used to handle all the UI events on the client side.
Since I am unfamiliar with javascript, i am seeking help here.
The issue we are seeing happens only with following conditions:
- Mozilla Firefox is the browser. Latest version included. Not reproducible in any other browsers.
- Zoom level set is above 130%
- Fairly long form hence there is vertical scrolling
Steps and issue:
- when users go to the end of the form and select a button or select a radio button, the page "jumps", in other words the focus shifts to the top of the page.
- This happens very inconsistently.
I found the following old stackoverflow article and tried the solution, but no luck. jQuery Focus fails on firefox
Any hints/clues will be helpful.
I have been debugging the following function to find out clues, but unfortunately the scroll to the top of the page happens much before this function is invoked:
/////////////////////////////////////////
// Precendence: //
// first text in focus region //
// current browser active element //
// first text on page if allowed //
/////////////////////////////////////////
focusOnActiveElement : function () {
if (AWFocusRegionId) {
var focusRegion = Dom.getElementById(AWFocusRegionId);
AWFocusRegionId = null;
if (focusRegion) {
var firstRegionText = this.findFirstText(focusRegion);
if (firstRegionText) {
AWActiveElementId = firstRegionText.id;
}
}
}
if (AWActiveElementId) {
try {
var activeElement = Dom.getElementById(AWActiveElementId);
if (Dom.elementInDom(activeElement) &&
!this.modallyDisabled(activeElement)) {
Debug.log("Focusing on element id: " + AWActiveElementId);
var activeElementId = AWActiveElementId;
function checkFocus () {
try {
// no active element, refocus
if (!Dom.getActiveElementId()) {
Debug.log("Refocusing on element id: " + activeElementId);
if (activeElement.focus) {
activeElement.focus();
activeElement.focus();
if (activeElement.select) {
activeElement.select();
}
}
}
}
catch (fe) {
Debug.log("Exceotion ",fe);
}
}
function fcs() {
if (activeElement.focus) {
activeElement.focus();
activeElement.focus();
if (activeElement.select) {
activeElement.select();
}
}
}
setTimeout(checkFocus, 1000);
setTimeout(fcs,0);
}
}
catch (e) {
Debug.log("Focusing exception: " + e);
}
finally {
AWActiveElementId = null;
}
}
if (!Dom.getActiveElementId() && AWAllowSelectFirstText) {
AWAllowSelectFirstText = false;
Debug.log("Focusing on first text: ");
this.selectFirstText();
}
}