Validate multiple HTML elements on a page using the wire.ui.validate method. This method will apply the validation configuration UI changes to the elements that fail validation. It will return true if all the elements pass validation and false if at least one does not.

This method uses the wire.validate method for each element's validation.


The following example validates three HTML elements. All three are required. user-phone needs to be a valid phone number and user-email needs to be a valid email address. If any of these conditions fail, the validate method will return false. The CSS class invalid will be added to any elements that fail validation.

const valid = wire.ui.validate(document, {
    css: "invalid",
    elements: {
        'user-name': { required: true },
        'user-phone': { required: true, type: "phone" },
        'user-email': { required: true, type: "email" }

For more on this method, visible wire.ui.validate.

Last updated