Asp validation summary not accessible for visually impaired people

Question

In my web app there are several forms which are using asp:ValidationSummary and asp:Label for client and server side validation of the form. But when I use a screen reader (JAWS 16) for accessibility test on the page it just skips the error and visually impaired people will not hear any error read back also it is not detected if you just use keyboard to navigate the page.

So if anyone can tell me a way to focus on the validation summary as soon as the submit button is pressed if there is an error. That would be great, I am ok with a JavaScript solution too, but I can't really replace validation summary with any other type of validation as number of forms are more than 50.

My Error Tag :

      <div>
        <asp:ValidationSummary ID="ValidationSummary2" tabindex="-1" runat="server" ShowMessageBox="false"
           ShowSummary="true" ForeColor="" DisplayMode="List" CssClass="label label-danger"
          ValidationGroup="Registration" />

<asp:Label ID="LblError" runat="server" tabindex="-1" CssClass="label label-danger"></asp:Label>
      </div>

JavaScript:

    function ValidateServerButtonClick() {
        if (typeof (Page_ClientValidate) == 'function') {
            Page_ClientValidate("Registration");
            if (Page_IsValid) {
                return true;
            }
            else {
                return false;
            }
        }
    }

Submit Button:

    <asp:Button ID="btnContinue" CssClass="cui-btn disabled cui-btn-med cui-full-width" 
  runat="server" CausesValidation="true" OnClick="btncontinue_Click"
  OnClientClick="ClearLabel()" Text="Sign up" Enabled="false" ValidationGroup="Registration" />

Rendered HTML:

What I tried:

I have already tried setting the focus intentionally on the error by calling focus() but that didn't worked either.

Answer 1

Setting the focus to your container DIV should do it. JAWS should start reading the content once it's focused.

function ValidateServerButtonClick() {
            if (typeof (Page_ClientValidate) == 'function') {
                Page_ClientValidate("Registration");
                if (Page_IsValid) {
                    return true;

                }
                else {
                    setTimeout(function () {
            $('#divid').focus();
        }, 700);
                    return false;

                }
            }
        }