Skip to Main Content

Breadcrumb

Overview: Client Validation

This example is a copy of the Validation example with additional client side validations implemented. Client validation uses the HTML 5 form validation feature. When a text field is declared as required, the required attribute is added. This is one of the HTML 5 validation constraint attributes and is why client validation of required fields automatically works. You can use other constraint attributes such as pattern, min, or max by adding those attributes in Advanced: Custom Attributes. Note that min and max only apply for inputs of type number. Because of inconsistent browser support and UI for number inputs APEX does not use them for the Number Field item type. You can also do your own validation using JavaScript in a dynamic action. An APEX extension to HTML 5 validation lets you specify the validation message using HTML attribute data-valid-message. Notice that the same validation works in Single Row View. This is because the grid view and single row view share the same column items.

  • The name field is constrained to letters, space, quote and dash. This is done on the client using the HTML 5 pattern attribute.
  • The Salary and Commission columns are validated to make sure they are valid numbers between 0 and 10,000. This validation is done on both the client and the server. See the Validate SAL and Validate COMM dynamic actions for how this is done.
  • The row validation that the Commission must be less than 1.5 times the Salary is also checked on the client. See the Validate comm limit dynamic action. Row level validation does not use HTML 5 validation. It listens for the apexendrecordedit event, checks the condition and uses a apex.model API to set the record validity.

Remember to always implement corresponding server side validation. The validation that the server does must be at least as strict as the client validation. Test the server validation by temporarily disabling the client validation.

Client Validation