Skip to main content

Support Article

Changing the alert message during Client side validation

SA-15686

Summary



How to change the error message **"Please correct flagged fields before submitting the form!"** that appears in an alert when client side validation is triggered?

Due to
Web Content Accessibility Guidelines (WCAG) AA level conformance, the alert message needs to include the amount of input or form issues that are on the page, for example "There are 6 errors in the current application form. Please go back, correct these issues, and re-submit."

The error message needs to include the variable of how many items are in an error state.

This alert is needed for the screen reader to announce the number of errors on the page when submitted.



Resolution



Perform the following local-change:
  1. Create a non-autogenerated section and include it below the navigation.
  2. Input the custom javascript in the section:

•    Replace the validation function
•    Iterate over each red label in the page
•    Gather how many exist and are visible to the user
•    Place the number in an alert box, with a new message


//overwrite existing function
function customClientErrorHandler(){
  if(Navigation.isDeferError() != 'true'){
        //reset the errorcounter each time we validate
        var errorCounter = 0;
        //get each error and iterate over them
        $('.iconError.dynamic-icon-error').each(function(){
            //make sure the label is visible to the user, and not hidden
            if ($(this).is(':visible')){
                //increase the error counter
                errorCounter++;
            }
        });

        //do the new alert with message.
        alert("Error Submitting Application.\n\nThere are " + errorCounter +  " errors on the application form submitted.\nPlease go back and fix the errors, then submit the form again.");
    
  return true;
  }
}


This will popup the alert, for the screen reader to announce.
 

Suggest Edit

Published January 31, 2016 - Updated October 8, 2020

Did you find this content helpful?

Have a question? Get answers now.

Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.

Ready to crush complexity?

Experience the benefits of Pega Community when you log in.

We'd prefer it if you saw us at our best.

Pega Community has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice
Contact us