Hide columns depending on checkbox state with Javascript I have a form with a fieldset where I created a simple checkbox:

$form['my_fieldset']['my_checkbox'] = array(
    '#type' =&gt; 'checkbox',
    '#title' =&gt; t('my title'),
    '#default_value' =&gt; 1,
    '#disabled' =&gt; FALSE,
);


Then, in other fieldset, I have a tableselect with these columns:


slot1
slot2
slot3


The data for these columns is as below:

'slot1' =&gt; array(
    'data'=&gt; array(
        '#type' =&gt; 'select',
        '#title' =&gt; 'Slot1',
        '#title_display'=&gt; 'invisible',
        '#default_value'=&gt; '',
        '#value' =&gt; 'slot1',
        '#options' =&gt; $my_options,
        '#name' =&gt; 'slot1',
        '#attributes' =&gt; array('class' =&gt; array('update-slot1')),
    ),
),
'slot2' =&gt; array(
    'data'=&gt; array(
        '#type' =&gt; 'select',
        '#title' =&gt; 'Slot2',
        '#title_display'=&gt; 'invisible',
        '#default_value'=&gt; '',
        '#value' =&gt; $emulator_data['slot2'],
        '#options' =&gt; $cards_available,
        '#name' =&gt; 'slot2[' . $emulator_data['container'] . ']',
        '#attributes' =&gt; array('class' =&gt; array('update-slot2')),
    ),
),
'config' =&gt; array(
    'data'=&gt; array(
        '#type' =&gt; 'select',
        '#title' =&gt; 'config title',
        '#title_display'=&gt; 'invisible',
        '#default_value'=&gt; '',
        '#value' =&gt; 'config',
        '#options' =&gt; $my_options,
        '#name' =&gt; 'config',
        '#attributes' =&gt; array('class' =&gt; array('update-config')),
    ),
),


What I need is to hide 'slot1' and 'slot2' columns if the checkbox is checked and hide the 'config' column if it's unchecked, using javascript.
#states is a good JavaScript only approach to hiding simple markup, but sometimes we need to modify the render array itself

To add/remove form elements or complex render arrays based on feedback, you can do so by checking the value of $form_state['values']['my_fieldset']['my_checkbox'] in a condition around your table column logic. Also wrap the other_fieldset with a div defined in #prefix and #suffix that has that wrapper id.

if (isset($form_state['values']) &amp;&amp; $form_state['values']['my_fieldset']['my_checkbox']) {
  // Add slot1/slot2 columns here.
}


Then add an AJAX/AHAH to the checkbox element:

$form['my_fieldset']['my_checkbox'] = array(
    '#type' =&gt; 'checkbox',
    '#title' =&gt; t('my title'),
    '#default_value' =&gt; 1,
    '#disabled' =&gt; FALSE,
    '#ajax' =&gt; array(
      'callback' =&gt; 'my_module_form_ajax_callback',
      'wrapper' =&gt; 'other-fieldset-id-wrapper',
      'method' =&gt; 'replace',
      'effect' =&gt; 'slide',
    ),
);


Then implement a function to return the form element you want to replace. Note that you do not modify the form/form_state here and modifying the form will have no effect. However the value of the checkbox will be stored in form_state values when the form is re-rendered.

  function my_module_form_ajax_callback($form, $form_state) {
    return $form['other_fieldset'];
  }