focus() not working

maich4316
maich4316 Community Member Posts: 13
All my courses have Skip to Main Content button (in Online and also on desktop courses) which was working absolutely fine for the last 5 years in IE8 and IE11. But lately the same code is not working in IE11. I am using Inspire V16.1.2 and using the below code in Header Scripting:

function setFocus()
{
document.getElementById('button100052').focus();
}

where 'button100052' is the "Skip to Main Content" button. The focus is going on to the browser URL in each page rather going to the "Skip to Main Content" button.

Again, there is a mouse-click Go To Web code in "Skip to Main Content" button that place the focus to a text field 'Main content anchor': javascript:document.getElementById('text69').focus(); This code is also not working.

So neither of the focus() functionality is working. Every time it is going to the browser address bar.

Any advice please? Thanks.

Comments

  • _
    _ Community Member Posts: 84
    Hello Mihir!! Long time no chat, how are things going for you?

    After a bit of reading, it appears that IE11 runs the focus() method before all of the page elements have been rendered correctly - one user suggests adding a small delay

    setTimeout(function() { document.getElementById('button100052').focus(); }, 10);

    More here: http://www.mkyong.com/javascript/focus-is-not-working-in-ie-solution/

    See if this works - typical IE...

    Cheers!

    Cam
  • maich4316
    maich4316 Community Member Posts: 13
    Hey Cam,

    Nice to see you after a long time.

    I have given some delay, but no luck.

    I am doing a responsive course. Any idea why the Test & Survey --> Customize Controls are disabled. I need to customize the Radio buttons and check boxes.

    Thanks,

    Mihir
  • wheels
    wheels Florida USACommunity Member, Administrator, Moderator, Rockstar Manager Posts: 603 eLearning ROCKSTAR Admin Team
    This is the way I recommend setting the focus to a button:

    Use an action on the target button (Skip to Main Content):

    Skip To Main Content
    - Action: On Show -> Run JavaScript -> (content below)

    %HTMLNAME%.div.getElementsByTagName('button')[0].focus();

    This creates a portable (you can copy it to other titles without worrying about what the object's name or id is) action that sets the focus to the object it is attached to.

    --------------

    If you need to set the focus when another action happens, like when the user clicks a button, then you need to do a little more work:

    On the button you want to set the focus to assign a known name:
    Target Button (where you are setting the focus)
    - Action: On Show -> Run JavaScript -> (content below)

    getDisplayWindow().myTargetButton = %HTMLNAME%;

    Trigger Button (triggers the set focus)
    - Action: On Mouse Click -> Run JavaScript -> (content below)

    getDisplayWindow().myTargetButton.div.getElementsByTagName('button')[0].focus();

    Assigning the HTMLNAME to a known name makes this a portable solution that can be reused in other titles.

    Hope this helps!
  • klaatu
    klaatu Community Member Posts: 988
    Try to remove the word javascript and the colon : from your run JavaScript action and see what happens.