Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Связанные селекты / 7 сообщений из 7, страница 1 из 1
25.02.2016, 09:07
    #39178337
Sapta
Sapta
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Связанные селекты
Добрый день.
Есть 2 селекта.
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
<select id="select1" name="select_1">
<option value="">Осуществите выбор</option>
<option value="2">Пункт 1</option>
<option value="50">Подпункт 1.1</option>
<option value="51">Подпункт 1.2</option>
<option value="3">Пункт 2</option>
<option value="52">Подпункт 2.1</option>
<option value="53"Подпункт 2.2</option>
<option value="4">Пункт 3</option>
<option value="54">Подпункт 3.1</option>
<option value="55">Подпункт 3.2</option>

<select id="select2" name="select_2">
<option value="">Осуществите выбор</option>
<option value="Пункт 1">Пункт 1</option>
<option value="Пункт 2">Пункт 2</option>
<option value="Пункт 3">Пункт 3</option>



Нужно их связать так, чтобы при выборе из второго селекта автоматически выбирался соответствующий пункт первого селекта (в идеале вообще чтобы сразу первый дочерний подпункт выбирал, но это уже следующий вопрос...).
Т.е. во втором селекте выбираем "Пункт 1". В результате чего в первом селекте автоматически выбирается "Пункт 1".
В познаниях js не силён. Наверное, ошибка простая...

До какого "творчества" дошёл:

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
var first = document.getElementById("select1"),
second = document.getElementById("select2");

second.onchange = function() {

 var number = second.selectedIndex,
 name = second.options[number].value;

 for (var i = 0; i < first.length; i++){
   if (first.options[i].text == name){
      first.options[i].selected = true;
   } 
 }
};


Перебор всех вариантов в лоб через условие if - мало подходит... т.к. позиций в селектах в оригинале немало.
Заранее благодарю за внимание.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
25.02.2016, 09:20
    #39178347
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Связанные селекты
Sapta
Код: javascript
1.
2.
 var number = second.selectedIndex,
 name = second.options[number].value;


Достаточно этого

Код: javascript
1.
name = second.value;



SaptaПеребор всех вариантов в лоб через условие if - мало подходит... т.к. позиций в селектах в оригинале немало.
В таком случае во втором селекте нужно иметь данные, которые сразу укажут какой option выбирать в первом селекте.
Например в некоем атрибуте можно сразу хранить индекс нужного option.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
25.02.2016, 10:04
    #39178391
Sapta
Sapta
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Связанные селекты
krvsaSapta
Код: javascript
1.
2.
 var number = second.selectedIndex,
 name = second.options[number].value;


Достаточно этого

Верно. Но number я дальше использую. А с name и правда можно упростить.

krvsaSaptaПеребор всех вариантов в лоб через условие if - мало подходит... т.к. позиций в селектах в оригинале немало.
В таком случае во втором селекте нужно иметь данные, которые сразу укажут какой option выбирать в первом селекте.
Например в некоем атрибуте можно сразу хранить индекс нужного option.
Проблематика в том, что исходные селекты нельзя менять. Приходится работать с тем, что есть.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
25.02.2016, 11:13
    #39178478
user89
user89
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Связанные селекты
SaptaПеребор всех вариантов в лоб через условие if - мало подходит... т.к. позиций в селектах в оригинале немало4 тыс. строк за полсекунды. А при совпадении, из цикла через break выходим...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
25.02.2016, 11:58
    #39178588
user89
user89
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Связанные селекты
SaptaПроблематика в том, что исходные селекты нельзя менять. Приходится работать с тем, что есть.А мы и не будем менять. Ищем без циклов через ассоциативный массив
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<select id="select1" name="select_1">
  <option value="">Осуществите выбор</option>
  <option value="2">Пункт 1</option>
  <option value="50">&#160;Подпункт 1.1</option>
  <option value="51">&#160;Подпункт 1.2</option>
  <option value="3">Пункт 2</option>
  <option value="52">&#160;Подпункт 2.1</option>
  <option value="53">&#160;Подпункт 2.2</option>
  <option value="4">Пункт 3</option>
  <option value="54">&#160;Подпункт 3.1</option>
  <option value="55">&#160;Подпункт 3.2</option>
</select>

<select id="select2" name="select_2">
  <option value="">Осуществите выбор</option>
  <option value="Пункт 1">Пункт 1</option>
  <option value="Пункт 2">Пункт 2</option>
  <option value="Пункт 3">Пункт 3</option>
</select>

<script>
function gid(i) {return document.getElementById(i);}
var first = gid('select1'), second = gid('select2'), obj = {}, i=0;
first.options[0].selected = true;
second.options[0].selected = true;

for (i=0; i<first.length; i++) {obj[first.options[i].text] = i;}

second.onchange = function() {first.options[obj[second.value]].selected = true;};
</script>
</body>
</html>
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
25.02.2016, 14:28
    #39178819
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Связанные селекты
SaptaПроблематика в том, что исходные селекты нельзя менять. Приходится работать с тем, что есть.
Тогда вариант user89 . Пройтись один раз, собрать нужную информацию, а потом ее использовать...

Если эти селекты менять нельзя - можно завести нечто другое и использовать это по аналогии с примером user89 .
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.02.2016, 08:52
    #39179493
Sapta
Sapta
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Связанные селекты
Большое спасибо за советы! Внимательно присмотрюсь к ассоциативному массиву.
Представленный в примере скрипт вроде исправно работает. Беда в ошибке, которую допустил по невнимательности в изначальных селектах первостепенной задачи.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Связанные селекты / 7 сообщений из 7, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]