[Solved] Getting an error message into focus


This is a follow on request from a prior issue that did get solved by Josh here:


The new issue is that although the javascript we have implement now does make the required comment boxes required if a certain answer is selected (i.e. a Deviation or Critical Deviation).

The new issue is that the browser does not move to provide focus to the question that needs to be answered and so the user thinks that they have not submitted the page and just continue to hit Submit.

I found this article that seems to address the javascript code that implements the required comment validation:


However I don’t understand how to dynamically update the script to pass the question id or some other identifier that would allow me to have the browser put focus on it such as:

<code><span class="pln">document</span><span class="pun">.</span><span class="pln">getElementById</span><span class="pun">(</span><span class="str">'tries'</span><span class="pun">).</span><span class="pln">focus</span><span class="pun">();<br /><br /></span></code>

such as defining a div with the id of tries.

Does anyone have an idea or a workaround on how to get this to work?

Jon Erickson asked

    Best answer


    I found a solution this problem by adding the following code to the script:

    // Bring error message into focus
    document.getElementsByClassName(“sg-error-message sg-error-display”)[0].scrollIntoView(true);

    Jon Erickson answered


      Question stats

      • Active
      • Views3543 times
      • Answers1 answer
      • Followers0 followers