Как использовать jquery для заполнения второго списка выбора на основе первого выбранного параметра

Question

Я пытаюсь динамически изменить параметры во втором списке выбора, используя jquery, в зависимости от того, какой элемент в первом списке выбора выбран.

Во втором списке выбора также должны быть оптгруппы.

Как бы я поступил так?

Спасибо

Answer 1

Вот пример использования JSON в качестве формата обмена данными. Вы можете использовать XML, JSON, HTML или даже передать JavaScript для оценки.

PHP:

$searchParam = $_GET['SEARCH_PARAM'];

//Get the matching results for the secondselect from your database
$results = $DB->query('Select ID, NAME, GROUP from mytable where parent = ?', $searchParam); 

//If you're using a PHP 5.2 or a newer version you have the json_encode function
print json_encode($results);

HTML:

<select id="firstselect" onchange="myfunc();">
  <option value="">Select one...</option>
  <option value="1">One option</option>
  <option value="2">Second choice</option>
</select>

<select id="secondselect"></select>

Javascript:

function myfunc() {
  var value = $("#firstselect").val();
  $.get("myjsonprovider.php", 
    {SEARCH_PARAM: value },
    dataType: "JSON",
    function(data) {
      var options = '<option value="">Select one...</option>';
      var optgroup = data[0].GROUP;
      options += '<optgroup label="' + data[i].GROUP + '">';
      for(var i = 0; i < data.length; i++) {
        if(optgroup != data[i].GROUP) {
          options += '</optgroup><optgroup label="'+data[i].GROUP+'">';
        }
        options += '<option value="' + records[i].ID +'">'+data[i].NAME+'</option>';
      }
      options += '</optgroup>';
      $("#secondselect").html(options);
    }
  );

}

Answer 2

Есть несколько плагинов, которые делают это. выполнить поиск связанных списков выбора.

один пример можно найти здесь http://manuel.radiohead.cl/proyectos/jquery/popdrodown/