Because Clientside validation States tries to validate every type of HTLM element forms often break.
Only input, select and textaread should be validated after a state change.
With the Drupal States API you can also change other HTML elements, so we need to take care of those.

Next to that, there is a problem during validation if the target is not visible. So this should be accounted for as well.
This can happen if for example the 'required' state is defined before 'visible'.

Example errors:

Uncaught TypeError: Cannot read property 'element' of undefined
    at HTMLDivElement.<anonymous> (jquery.validate.js?oxe870:103)
    at Function.each (jquery.min.js?v=1.10.2:3)
    at $.fn.init.each (jquery.min.js?v=1.10.2:3)
    at $.fn.init.valid (jquery.validate.js?oxe870:102)
    at HTMLDocument.<anonymous> (clientside_validation_states.js?oxe870:31)
    at HTMLDocument.dispatch (jquery.min.js?v=1.10.2:4)
    at HTMLDocument.v.handle (jquery.min.js?v=1.10.2:4)
    at Object.trigger (jquery.min.js?v=1.10.2:4)
    at HTMLDivElement.<anonymous> (jquery.min.js?v=1.10.2:4)
    at Function.each (jquery.min.js?v=1.10.2:3)

Example form:

$form['show'] = array(
    '#type' => 'select',
    '#title' => t('Show radios'),
    '#options' => array(
      'no' => t('No'),
      'yes' => t('Yes'),
    ),
);

$form['radios'] = array(
    '#type' => 'select',
    '#title' => t('Radios'),
    '#options' => array(
      'option1' => t('Option'),
      'option2' => t('Option'),
    ),
    '#states' => array(
      'required' => array(
        ':input[name="show"]' => array('value' => 'yes'),
      ),
      'visible' => array(
        ':input[name="show"]' => array('value' => 'yes'),
      ),
    );
);
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

sjerdo created an issue. See original summary.

sjerdo’s picture

I have attached a patch for this issue.
This patch will only validate fields that are visible.

Also it will find the form elements within the states target and validate these, instead of the wrapper around the radios.

sjerdo’s picture

Status: Active » Needs review
dmsmidt’s picture

Issue summary: View changes

Clarify IS.

dmsmidt’s picture

Status: Needs review » Reviewed & tested by the community

Works like a charm

  • nikunjkotecha committed fc51dce on 7.x-1.x authored by sjerdo
    Issue #2914383 by sjerdo, dmsmidt: Clientside Validation States JS error...
nikunjkotecha’s picture

Status: Reviewed & tested by the community » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.