dependent dropdowns in a table

by Aaron   Last Updated April 16, 2018 06:07 AM

Thank you for taking time to help me out...

I have 3 dropdown forms displayed in a table. Each dropdown is dependent on the previous dropdown selection.

Ex. Company -> Division -> Employee

I was able to get it working outside of a table, however, I can't get it working in a table. Does anyone have any thoughts on how to make this work? Here's the code:

` //TABLE WRAPPER function dropdown_form($form, &$form_state) { $form_state['cache'] = TRUE;

  $form['table_wrapper'] = array(
    '#tree' => FALSE,
    '#weight' => -4,
    '#prefix' => '<div class="clearfix" id="table-wrapper">',
    '#suffix' => '</div>',
  );
  $form['table_wrapper']['row_wrapper'] = array(
    '#prefix' => '<div id="row-wrapper">',
    '#suffix' => '</div>',
    '#theme' => 'dropdown_table',
  );

  $key = 1;  
  $form['table_wrapper']['row_wrapper'][$key] = _dropdown_table_rows_form($key, 0, 0, 0);

  return $form;
}

// FORMS WITHIN TABLE
function _dropdown_table_rows_form($key, $first_dropdown = 0,$second_dropdown = 0, $third_dropdown = 0) {
  $form = array(
    '#tree' => TRUE,
  );

  $options_first = _first_dropdown_options();
  $first_dropdown_selected = isset($form_state['values']['dropdown_first']) ? $form_state['values']['dropdown_first'] : '';
  $second_dropdown_selected = isset($form_state['values']['dropdown_second'])  ? $form_state['values']['dropdown_second'] : '';

  $form['first_dropdown'] = array(
    '#type' => 'select',
    '#title' => t('First Dropdown'),
    '#title_display' => 'invisible',
    '#parents' => array('row_wrapper', $key, 'first_dropdown'),
    '#options' => $options_first,
    '#default_value' => $first_dropdown,
    '#ajax' => array(
      'callback' => 'first_dropdown_callback',
      'wrapper' => 'second-dropdown-replace',
    ),
  );

  $form['second_dropdown'] = array(
    '#type' => 'select',
    '#title' => t('Second Dropdown'),
    '#title_display' => 'invisible',
    '#parents' => array('row_wrapper', $key, 'second_dropdown'),
    '#prefix' => '<div id="second-dropdown-replace">',
    '#suffix' => '</div>',
    '#options' => isset($first_dropdown_selected) ? _second_dropdown_options($first_dropdown_selected) : '',
    '#default_value' => $second_dropdown,
    '#ajax' => array(
      'callback' => '_second_dropdown_callback',
    ),
  );

  $form['third_dropdown'] = array(
    '#type' => 'select',
    '#title' => 'Third Dropdown',
    '#title_display' => 'invisible',
    '#parents' => array('row_wrapper', $key, 'third_dropdown'),
    '#prefix' => '<div id="third-dropdown-replace">',
    '#suffix' => '</div>',
    '#options' => isset($second_dropdown_selected) ? _third_dropdown_options($second_dropdown_selected) : '',
    '#default_value' => $third_dropdown,
  );

  return $form;
}

 // THEME TABLE
function theme_dropdown_table(&$variables) {
  $form = $variables['form'];

  $delta =0;
  $rows = array();
  $headers = array('', 'First Dropdown');
  $headers[] = t('Second Dropdown');
  $headers[] = t('Third Dropdown');

  foreach (element_children($form) as $key) {
    $delta++;
    $row = array(
      'data' => array(
        array('class' => array('row-flag')),
      ),
    );
    $row['data'][] = drupal_render($form[$key]['first_dropdown']);
    $row['data'][] = drupal_render($form[$key]['second_dropdown']);
    $row['data'][] = drupal_render($form[$key]['third_dropdown']);
    $rows[] = $row;
  }
  $content = theme(
    'table',
    array(
      'header' => $headers,
      'rows' => $rows,
      'attributes' => array('id' => 'dropdown-table')
    )
  );
  $content .= drupal_render_children($form);
  return $content;
}

// CALLBACK FUNCTIONS
function _first_dropdown_callback($form, &$form_state) {
  $commands = array();
  $commands[] = ajax_command_insert('#second-dropdown-replace', drupal_render($form['table_wrapper']['row_wrapper']['second_dropdown']));
  return array(
    '#type' => 'ajax',
    '#commands' => $commands
  );
}

function _second_dropdown_callback($form, $form_state) {
  $commands = array();
  $commands[] = ajax_command_insert('#third-dropdown-replace', drupal_render($form['table_wrapper']['row_wrapper']['third_dropdown']));
  return array(
    '#type' => 'ajax',
    '#commands' => $commands
  );
}

// DROPDOWN OPTIONS
function _first_dropdown_options() {
  // return db list 1
}

function _second_dropdown_options($first_dropdown_selected) {
  // return db list 2
}

function _third_dropdown_options($second_dropdown_selected) {
  // return db list 3
}

`

Tags : forms


Related Questions




Reuse form from another module in multistep form

Updated May 21, 2015 22:03 PM