В зависимости от выбора в Select изменить значения другого Select

[Tayfun]

Здравствуйте, уважаемые форумчани!
К сожалению возникла такая проблема, нужно при выборе какого либо из значения select изменить значения в другом Select, можно средствами php. Проблема в том, что изменения вступают только после нажатия на кнопку, а мне это ненужно.
Прилагается страничка. Помогите кто чем может!

[wall66]

делайте при выборе асинхронный запрос к серверу возвращающий данные для другого селекта

http://xmlhttprequest.ru/

[jeka5555]

Приведу пример на основе Стран и их основных городов. Тоесть у нас будет два селекта, в одном список стран, в другом список их городов. При выборе страны в другом селекте у нас будет появляться соответствующие города.

Код формы:

<form name="address" action="#">
Страна:
<select name="street" onChange="MkHouseValues(this.selectedIndex)">
<option value="Россия">Россия</option>
<option value="Англия">Англия</option>
<option value="Италия">Италия</option>
<option value="Франция">Франция</option>
<option value="Украина">Украина</option>
</select>
&nbsp;Город:
<select name="house">
<option value="N/A">N/A</option>
</select>
</form>

Сам скрипт:

<script type="text/javascript">
<!--
// Формируем массив городов
var aHouseValues = new Array(
"Москва, Питер, Самара, Бугуруслан",
"Лондон, Мантчестер",
"Рим, Турин",
"Париж",
"Киев, Семфирополь"
);

// ф-ция, возвращающая массив городов по заданной стране
function getHouseValuesByStreet(index){
    var sHouseValues = aHouseValues[index];
    return sHouseValues.split(","); // преобразуем строку в массив городов
}

// ф-ция, выводящая динамически список городов
function MkHouseValues(index){
    var aCurrHouseValues = getHouseValuesByStreet(index);
    var nCurrHouseValuesCnt = aCurrHouseValues.length;
    var oHouseList = document.forms["address"].elements["house"];
    var oHouseListOptionsCnt = oHouseList.options.length;
    oHouseList.length = 0; // удаляем все элементы из списка городов
    for (i = 0; i < nCurrHouseValuesCnt; i++){
        // далее мы добавляем необходимые города в список
        if (document.createElement){
            var newHouseListOption = document.createElement("OPTION");
            newHouseListOption.text = aCurrHouseValues[i];
            newHouseListOption.value = aCurrHouseValues[i];
            // тут мы используем для добавления элемента либо метод IE, либо DOM
            (oHouseList.options.add) ? oHouseList.options.add(newHouseListOption) : oHouseList.add(newHouseListOption, null);
        }else{
            // для NN3.x-4.x
            oHouseList.options[i] = new Option(aCurrHouseValues[i], aCurrHouseValues[i], false, false);
        }
    }
}

// инициируем изменение элементов в списке городов, в зависимости от текущей страны
MkHouseValues(document.forms["address"].elements["street"].selectedIndex);
//-->
</script>

Короче, отслеживаем событие onChange в одном селекте и меняем динамически второй.

[NickPop]

Уважаемый jeka5555!
Ваш скрипт самый лучший и понятный во всем интернете.СПАСИБО!
Это даже не лесть, а факт.
Но я столкнулся с проблемой запоминания выбора из второго списка.
После выбора в форме, мы каждый раз возвращаемся в начало.
Я записываю данные с формы в БД. Страна легко запоминается и повторно выводится в форме, а города крутятся в массиве и подставить Последний выбор города в начало через РНР не получается.

// Формируем массив городов
var aHouseValues = new Array(
"Последний выбор города, Москва, Питер, Самара, Бугуруслан",
"Последний выбор города, Лондон, Мантчестер",
"Последний выбор города, Рим, Турин",
"Последний выбор города, Париж",
"Последний выбор города, Киев, Симферополь"

Если вы допишите скрипт или дадите совет буду вам признателен.
С уважением,
Николай Васильевич