Validation of ajax forms with class 'cv-validate-before-ajax' doesn't work

Created on 26 January 2022, almost 3 years ago
Updated 15 January 2024, 12 months ago

Problem/Motivation

Validation of ajax forms with class 'cv-validate-before-ajax' doesn't work

Steps to reproduce

Create ajax form with some required fields. In our case ajax form is loaded by ajax in modal window. Add class cv-validate-before-ajax to the form by form_alter or in form's build method. Don't feel required fields and click on submit button. The form will be submitted by ajax and the validation errors should be shown. But the validation has to be done before the submission.

Proposed resolution

I debugged code in clientside_validation/clientside_validation_jquery/js/cv.jquery.validate.js and noticed that this.element in $(this.element).hasClass('cv-validate-before-ajax')) returns button clicked on the form. Replacing this.element with this.$form helps to fix the issue.

Remaining tasks

User interface changes

API changes

Data model changes

πŸ’¬ Support request
Status

Needs work

Version

3.0

Component

Code

Created by

πŸ‡ΊπŸ‡¦Ukraine khiminrm

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • Hi, I was trying to adjust the configuration of the Clientside Validation module and ran into the same issue - I expected the class 'cv-validate-before-ajax' to cause a change in behaviour when add to the form, not an element. This is because on the configuration page for Clientside Validation jQuery it says "All forms with class "cv-validate-before-ajax" will be validated by default".

    When I went looking for more information, I found the issue where this was worked on β†’ , where I felt the discussion also implied that the class should be applied to the form. It wasn't until I found this issue that I realised that it just doesn't work that way.

    For me, it would be preferable to the class to trigger the expected behaviour when attached to the form. I would find it very useful for the feature to work as described.

Production build 0.71.5 2024