How to debug #states mecanism - trying to get #states to work with inner fieldsets & webform

Question

I have a relatively simple webform, with 2 fieldsets and a few other fields. The fields aformentionned have #states actions configured and behaving proper like in a regular form.

It is in the fieldset shown below I have a problem. THe fieldset should be collapsed (via #states) and there is nothing I can do to make it so.

The offending fieldset has #states defined in the bottom form_alter, I outlined the error location in caps:

// Implements hook_form_alter()
function formHelper_form_alter(&$form, $form_state, $form_id)  {            
switch ($form_id)  {

        case 'webform_client_form_1':

           // Set fieldsets as collapsible
          $form['submitted']['inscription']['#collapsible'] = true;
          $form['submitted']['inscription']['#collapsed'] = true;              

          $form['submitted']['inscription']['enfant_1']['#collapsible'] = true;
          $form['submitted']['inscription']['enfant_1']['#collapsed'] = false;

          $form['submitted']['inscription']['enfant_2']['#collapsible'] = true;
          $form['submitted']['inscription']['enfant_2']['#collapsed'] = true;             

            //vardump of fieldset
           dpm($form['submitted']);

           // Show datepicker for child one if inscription is part time
           $form['submitted']['inscription']['enfant_1']['jrs_semaine']['#states'] = array(
              'visible' => array(   // action to take.
                ':input[name="submitted[inscription][enfant_1][horaire]"]' =>
                  array('value' => 't_partiel'),
              ),   
           );
           // Show datepicker for child two if inscription is part time  
           $form['submitted']['inscription']['enfant_2']['jrs_semaine2']['#states'] = array(
              'visible' => array(   // action to take.
                ':input[name="submitted[inscription][enfant_2][horaire_2]"]' =>
                  array('value' => 't_partiel'),
              ),   
           );
            // THIS IS THE FIELDSETY THST DOES NOT WORK: 
           // set state on second fieldset to be visible only when two is seiected.       
           $form['submitted']['inscription']['enfant_2']['#states'] = array(
              'expand' => array(   // action to take.
                ':input[name="submitted[inscription][enfant_1][horaire]"]' =>
               array('value' => 't_partiel'),
              ),   
           );
          break;
 }
}

Now, in the drupal docs (example module) there is a fieldset shown with working code using as the state to change, and it seems in the docs fieldsets are clearly supported, alas not the one in my webform.

I am using the same condition that is working on the other field so I assume the problem is not with the selector. In light of this fact, I have no clue of what even to really look for but I really want to figure it out.

Is anyone familiar enough with #states to tell me how I could debug the js in this case?

I know it is in /misc/states.js, I just don't know what to look for in states.js, or even if this is what is preventing the fieldset from collapsing.

update: Reposted the full hook_form_alter function as per request.

Answer 1

Can you add the full code for both form items?

If the element needs to be collapsed at start-up you need to add '#collapsed' => TRUE,

It also looks like there's an error in you're selector as pointed out in comments