Интерактивная форма в зависимости от Select List не работает

Question

Так что я пытаюсь сделать этот клип форму представления интерактивной следующим образом:

Я хочу второй выбор Выберите список, чтобы изменить в соответствии с которым город выбран в первом выберите список.

Вот мой код скрипта функции:

<script> 
function spotListChange(s1, s2) { 
    var s1 = document.getElementById(s1); 
    var s2 = document.getElementById(s2); 
    s2.innerHTML = ""; 
    if(s1.value == ""){ 
     var optionArray = ["|"]; 
    } 
    <?php 
    while ($cityList = $cityListDB->fetch()) { 
     $city = $cityList['city']; 
     $spotList = $db->query("SELECT * FROM spots WHERE city='$city' ORDER BY name"); 
     ?> 
     else if(s1.value == "<?php echo $city; ?>"){ 
      var optionArray = ["|" 
           <?php 
           while ($spot = $spotList->fetch()) { 
            echo ", \"" . $spot['city'] . "|" . $spot['city'] . "\""; 
           } 
           ?> 
           ]; 
     } 

    <?php 
    } 
    ?> 

    for(var option in optionArray){ 
     var pair = optionArray[option].split("|"); 
     var newOption = document.createElement("option"); 
     newOption.value = pair[0]; 
     newOption.innerHTML = pair[1]; 
     s2.options.add(newOption); 
    } 
} 
</script> 

Вот часть формы с двумя отборными списками. (Я избавлюсь от большинства вариантов города, доступных только чтобы сделать код короче)

<select id="city" name="city" style="margin-left: 135px;" onChange="spotListChange('city', 'spotSelectList')" required> 
     <option value="" selected="selected">Ville...</option> 
     <option value="Albanel">Albanel</option> 
     <option value="Alma">Alma</option> 
     <option value="La Doré">La Doré</option> 
     <option value="Saint-Félicien">Saint-Félicien</option> 
     <option value="Mashteuiatsh">Mashteuiatsh</option> 
    </select><br /> 
    <select id="spotSelectList" name="spot" style="margin-left: 135px;"> 
    </select> 

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

Answer 1

Сделайте себе одолжение и используйте jquery для этого, это делает ваш код более простым и содержит много учебника. Я рекомендую вам ответить json от php на ajax-вызов из jquery (javascript).

Вы можете увидеть это в качестве ссылки: http://simpleweb.github.io/jquery-dependent-selects/ также это: http://www.9lessons.info/2010/08/dynamic-dependent-select-box-using.html

Надеется, что это помогает.