| |
|
|
| | zdrastvujete.
kto znajet kak sdelast select v kotorym elementy budut formitowatsja v zavisimosti od drugova selecta.
naprimer: oblast, i gorod. | |
| |
|
|
| |
|
|
| |
для: Okey
(19.07.2008 в 22:07)
| | | Nikak ne sdelat'.
Eto nevozmozhno v principe!
Takzhe kak i vam nel'zja pisat' kirillicei.
Nauchites' pisat' po-russki - ja srazu zhe nauchus' pomogat' vam s vashei problemoi. | |
| |
|
|
| |
|
|
| |
для: PAT
(19.07.2008 в 22:35)
| | | ок. извините ))
так можете помочь с этими селектами? | |
| |
|
|
| |
|
|
| |
для: Okey
(19.07.2008 в 22:50)
| | | В поиск. За последние две недели это как миниму два раза уже рассматривалось на форуме. | |
| |
|
|
| |
|
|
| |
для: Okey
(19.07.2008 в 22:50)
| | | Принцип один
на ПЕРВЫЙ селект навешивается функция по событию ONCHANGE, которая во ВТОРОМ селекте:
- формирует новые опшены методом createElement (),
- напрямую прописывает значения value и text новых опшенов ,
- новые опшены добавляет в коллекцию опшенов методом add (),
- ненужные опшены удаляет методом remove ()
Всё вышеизложенное в JS-виде выглядит приблизительно так:
<select id="first" onchange="myFunc (this.selectedIndex)">
...
<select id="second">
...
function myFunc (x)
{
...
var newOption = document.createElement ('option');
newOption.value = 'Значение_VALUE [в зависимости от x]';
newOption.text = 'Видимый_юзеру_текст_опшена [в зависимости от x]';
document.getElementById ('second').options.add (newOption);
...
document.getElementById ('second').options.remove (индекс_удаляемого_опшена [в зависимости от x])
}
|
Проблемой является получение данных (value и text) для опшенов ВТОРОГО селекта в зависимости от выбранного опшена в ПЕРВОМ селекте.
Способов решения этой "проблемы" масса - от простейшего прописывания скрипт-массивов (для незначительного количества вариантов) до работы через AJAX (при ОЧЕНЬ больших объемах).
Если немного помедитировать, то становится ясно, что в 99% случаях - даже при значительных объемах вариантов - предпочтительным является простейший способ, т.е. ИЗНАЧАЛЬНАЯ подгрузка ВСЕХ возможных вариантов в виде скрипт-массивов. Ибо неоднократное ожидание ответов от сервера ПО-ЛЮБОМУ превысит время, затраченное браузером при подгрузке всех вариантов в скриптовом виде сразу.
Простейший пример: два селекта, в первом - ДВА работающих опшена (из всего трёх), по выбору которых формируется второй селест:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=win-1251">
<script>
//пары value=text для второго селекта
var A = new Array ();
A [0] = 'red=красная|blue=синяя|yellow=желтая';
A [1] = 'mon=понедельник|tue=вторник|wed=среда|thu=четверг|fri=пятница|sat=суббота|sun=воскресенье';
//функция формирования второго селекта
function myFunc (x)
{
if (!x) {document.getElementById ('second').style.visibility = 'hidden'; return}
for (var j = document.getElementById ('second').options.length - 1; j >= 0; j--)
document.getElementById ('second').options.remove (j);
for (var obj = A [x - 1].split ('|'), j = 0; j < obj.length; j++)
{
var newOption = document.createElement ('option');
var t = obj [j].split ('=');
newOption.value = t [0];
newOption.text = t [1];
document.getElementById ('second').options.add (newOption);
}
document.getElementById ('second').style.visibility = 'visible';
}
</script>
</head>
<body>
<select id="first" style="width: 200px" onchange="myFunc (this.selectedIndex)">
<option style="color: red">Выбери меня</option>
<option>птица счастья</option>
<option>завтрашнего дня</option>
</select>
<select id="second" style="visibility: hidden; width: 150px"></select>
</body>
</html>
|
| |
| |
|
|
