php dropdown menu population

Question

Я пытаюсь написать php-скрипт, который заполнит второе выпадающее меню, основанное на выборе основного выпадающего меню. Я хотел бы использовать jquery, чтобы делать все ненужные обновления. но все, что я обнаружил, что существует там, трудно понять и изменить, знаете ли вы что-либо, что было хорошо написано и понято, или, может быть, учебник, который существует там?

Answer 1

два способа:

• сделать первый триггер уровня AJAX запросы, которые возвращают данные, необходимые для второго уровня
• написать древовидную структуру со всеми необходимыми данными для всех возможных выборов, и скрыть его где-то на начальной странице, где ваш Javascript может ее прочитать. Либо готовые HTML-меню (скрыть и показать по мере необходимости), либо в большом объекте JSON в части JS.

Answer 2

Есть немало примеров того, как сделать это в Интернете, хороший один here от Remy Sharp на своем блоге (full example here)

В основном то, что вы делаете вызов PHP страницу на ваш сервер со значением вашего первого раскрывающегося списка, когда он будет изменен. Например, если ваш первый выпадающий список является списком состояний в США, ваш второй раскрывающийся список может показывать города в выбранном состоянии. Когда первый выпадающий выбран, это onChange событие срабатывает офф запрос на PHP страницу на сервере, передавая имя состояния (example.com/city_lookup.php?state=NY)

JQuery затем получает ответ от city_lookup сценария (JSON encoded, вероятно, лучший путь сюда), затем циклически перебирает его и записывает значения во второе раскрывающееся меню.

Answer 3

Вот код, который должен дать вам представление о том, что вы хотите сделать:

HTML

<select id="state" name="state"> 
    <option value="IL">Illinois</option> 
    <option value="IN">Indiana</option> 
</select> 
<select id="city" name="city"> 
    <option value="">Please select a state...</option> 
</select> 

PHP

<?php 
    $cities = array(
     'IL' => array('Chicago', 'Naperville', 'Decatur', 'Saint Charles'), 
     'IN' => array('Gary', 'Miller', 'Portage', 'Merrillville') 
    ); 

    print json_encode($cities[ $_POST[ 'state' ] ]); 
    exit; 
?> 

JQuery

jQuery(document).ready(function() { 

    jQuery('#state').change(function() { 
     jQuery.post(
      'some-url.php', 
      { 
       'state':jQuery('#state').val() 
      }, 
      function(data, textStatus) { 
       jQuery.each(data, function(index, value) { 
        jQuery('#city').append('<option value="' + value + '">' + value + '</option>'); 
       }); 
      }, 
      'json' 
     ); 
    }); 

}); 

Answer 4

Добавить еще одну строку jQuery('#city').html('');
Теперь код выглядит следующим образом:

jQuery(document).ready(function() { 

    jQuery('#state').change(function() { 

      jQuery('#city').html(''); 
      jQuery.post(
       'some-url.php', 
       { 
         'state':jQuery('#state').val() 
       }, 
       function(data, textStatus) { 
         jQuery.each(data, function(index, value) { 
           jQuery('#city').append('<option value="' + value + '">' + value + '</option>'); 
         }); 
       }, 
       'json' 
     ); 
    }); 

});