Drupal 7 - How to change multiple drop-downs using AJAX?

Question

I'm new to Drupal & PHP. I have a similar problem to this unanswered question and I could not find one myself.

I need 3 dependent drop-downs where the user need to select:

• 1st- The Lecturer.
• 2nd- one of his related courses.
• 3rd- one of the course chapters.

(the data is extracted from a DB)

As individuals they work fine (when I choose a lecturer the course list get updated, when I choose a course the chapters get updated), but when I choose a lecturer the chapter list won't get updated to reflect the changes to the course drop-down.

This is the code I wrote so far:

function test_form($form, &$form_state)
{
  $form = array();
  $lect_options = drupal_map_assoc(get_lecturer_dropdown_options());
  $selected_lect = isset($form_state['values']['lect']) ? $form_state['values']['lect'] : key($lect_options);

  $form['lect'] = array(
    '#type' => 'select',
    '#title' => t('Lecturer Name:'),
    '#default_value' => $selected_lect,
    '#options' => $lect_options,
    '#ajax' => array(
       'callback' => 'ajax_dependent_crs_dropdown_callback',
       'wrapper' => 'dropdown-course-replace',
       ),
    );

  $course_options = drupal_map_assoc(_ajax_get_crse_dropdown_options($selected_lect));
  $selected_course = isset($form_state['values']['course']) ? $form_state['values']['course'] : key($course_options);

  $form['course'] = array(
    '#type' => 'select',
    '#title' => t('Courses:'),
    '#prefix' => '<div id="dropdown-course-replace">',
    '#suffix' => '</div>',
    '#options' => $course_options,
    '#default_value' => $selected_course,
    '#ajax' => array(
      'callback' => 'ajax_dependent_chap_dropdown_callback',
      'event' => 'change',
      'wrapper' => 'dropdown-chap-replace',
     ),
   );

  $form['chapter'] = array(
    '#type' => 'select',
    '#title' => t('Chapter:'),
    '#prefix' => '<div id="dropdown-chap-replace">',
    '#suffix' => '</div>',
    '#options' => _ajax_get_chap_dropdown_options($selected_course),
  );    

  return $form;
}

function ajax_dependent_crs_dropdown_callback($form, $form_state) {
  return $form['course'];
}
function ajax_dependent_chap_dropdown_callback($form, $form_state) {
  return $form['chapter'];
}

function get_lecturer_dropdown_options()
{
  $lect_array = array();

  $lect_result = db_query("SELECT Vod_Lectuerers.LecturerID, Vod_Lectuerers.LecFirsName, Vod_Lectuerers.LecLastName FROM Vod_Lectuerers ORDER BY Vod_Lectuerers.LecturerID");

  foreach ($lect_result as $lect_key=>$lect_row)//Get each lecturer data from the query result
  {
    $lect_array[] = $lect_row->lecturerid . '# ' . $lect_row->lecfirsname . ' ' . $lect_row->leclastname;
  }

  return $lect_array;
}

function _ajax_get_crse_dropdown_options($key) 
{
  if ($key!='')
  {   
    $course_data = array();
    $lect_id = substr($key, 0, 4);//cut the ID for the key recived by function

    $crs_result = db_query("SELECT Vod_Course.CourseID, Vod_Course.CourseName FROM Vod_Course WHERE Vod_Course.LecturerID='$lect_id' ORDER BY Vod_Course.CourseID", array($lect_id));

    foreach ($crs_result as $crs_key=>$crs_row)//Get each course data from the query result
    {
      $course_data[] = $crs_row->courseid . '# ' . $crs_row->coursename;
    }
    return $course_data;
  }
  else 
  {
    return array();
  }
}

function _ajax_get_chap_dropdown_options($key) 
{
  if ($key!='')
  {   
    $chapter_data = array();
    $course_id = substr($key, 0, 1);//cut the ID

    $cptr_result = db_query("SELECT Vod_Chapters.ChapterID, Vod_Chapters.ChapterDescription FROM Vod_Chapters WHERE Vod_Chapters.CourseID='$course_id' ORDER BY Vod_Chapters.ChapterID", array($course_id));

    foreach ($cptr_result as $cptr_key=>$cptr_row)//Get each chapter data from the query result
    {
      $chapter_data[] = $cptr_row->chapterid . '# ' . $cptr_row->chapterdescription;
    }

    return $chapter_data;
  }
  else 
  {
    return array();
  }
}

Any help would be most appreciated.

Answer 1

You can use Hierarchical Select module to do that. You should also follow this tutorial to get you started.

Hope this helps... Muhammad.