powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как сделать два связанных выпадающих списка?
42 сообщений из 42, показаны все 2 страниц
Как сделать два связанных выпадающих списка?
    #38194550
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Добрый день!
Мне нужно сделать два связанных выпадающих списка, например в первом выбираем название оборудования, а во втором соответственно будут уже серийные номера к этому оборудованию из первого списка.

В интернете нашел примерно такой код, но не понимаю как он работает:
Код: php
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
<script>
var dipla = 0;
function GetSel(i){
document.getElementById('pse-'+dipla).style.display = 'none';
document.getElementById('pse-'+i).style.display = 'block';
dipla = i;
}
</script>

echo '<select id=main OnChange="GetSel(this.selectedIndex);"><option selected value="1____1">1____1</option>';
echo '<option value="2____2">2____2</option></select>';
echo '<select id=pse-0>...</select>';
echo '<select id=pse-1 style="display:none;">...</select>';


Если у нас есть первый массив, то через какую переменную передается выбор из первого select во второй?
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194558
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Ferum1Мне нужно сделать два связанных выпадающих списка, например в первом выбираем название оборудования, а во втором соответственно будут уже серийные номера к этому оборудованию из первого спискапредставим (гипотетически) что в первом списке выбрано всё
сколько (примерно) должно стать элементов во втором списке?
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194580
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
пока думаю не более 1000... Массив для примера, а база соответственно хранится в mysql.
Хочу делать выборку компьютерного оборудования и к каждому привязывать серийник. На монитор acer свои серийники, на samsung свои и т.д.
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194590
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
наверное разумно в яву как то вставлять сразу sql запрос на серийники?
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194631
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194941
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Паганель http://jsfiddle.net/sGPnV/1/
Попробовал вставить скрипт, но у меня он не работает, только html показывает.
Пробовал <select id="main" OnChange="main_change();"> не помогает
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194950
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Ferum1Попробовал вставить скрипт, но у меня он не работаеттекст ошибки я должен угадать?
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194955
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
ПаганельFerum1Попробовал вставить скрипт, но у меня он не работаеттекст ошибки я должен угадать?
ошибок нет, но скрипт игнорируется
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194959
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Ferum1Паганельпропущено...
текст ошибки я должен угадать?
ошибок нет, но скрипт игнорируетсяну поставьте 2 alert-а, один перед скриптом, а второй - после
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194975
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
ПаганельFerum1пропущено...

ошибок нет, но скрипт игнорируетсяну поставьте 2 alert-а, один перед скриптом, а второй - после
выскакивает пустое сообщение
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38194977
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Ferum1выскакивает пустое сообщениеодно? а почему не два?
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195000
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
ПаганельFerum1выскакивает пустое сообщениеодно? а почему не два?
до этой строки "$(function() {" сколько угодно алертов выполняется после строки "}); " ни одного
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195162
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Ferum1до этой строки "$(function() {" сколько угодно алертов выполняется после строки "}); " ни одногоследовательно, Ваше утверждениеFerum1скрипт игнорируетсяневерно

покажите что у Вас в консоли
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195342
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: php
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.
<script>
alert();
 function main_change() {
    var val = $('#main option:selected').val(),
        selector = '#child option[main-value="' + val + '"]';
    $('#child option').removeAttr('selected').hide();
    $(selector).show();
    $(selector + ':first').attr('selected', 'selected');
}
$(function() {
    $('#main').change(main_change);
    main_change();
});
alert();
</script>

<select id="main" OnChange="main_change();">
    <option value="first">Main First</option>
    <option value="second">Main Second</option>
    <option value="third">Main Third</option>
</select>


<select id="child">
    <option main-value="first">First #1</option>
    <option main-value="first">First #2</option>
    <option main-value="first">First #3</option>
    <option main-value="second">Second #1</option>
    <option main-value="third">Third #1</option>
    <option main-value="third">Third #2</option>
    <option main-value="third">Third #3</option>
    <option main-value="third">Third #4</option>
</select>
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195347
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
а в консоли что?
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195396
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
консоль сообщение от алерт?
там сообщение от "веб страницы, воскл знак и окей"
а на веб странице когда делаю выбор в первом списке, во втором ничего не прооисходит
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195400
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
нажмите F12 и найдите консоль
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195413
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
<!-- saved from url=(0045)http://www.test.ru/edit_place.php -->
<!-- Generated by F12 developer tools. This might not be an accurate representation of the original source file -->
<HTML><HEAD>
<SCRIPT>
alert();
 function main_change() {
    var val = $('#main option:selected').val(),
        selector = '#child option[main-value="' + val + '"]';
    $('#child option').removeAttr('selected').hide();
    $(selector).show();
    $(selector + ':first').attr('selected', 'selected');
}
$(function() {
    $('#main').change(main_change);
    main_change();
});
alert();
</SCRIPT>
</HEAD>
<BODY><SELECT id=main> <OPTION selected value=first>Main First</OPTION> <OPTION value=second>Main Second</OPTION> <OPTION value=third>Main Third</OPTION></SELECT> <BR><SELECT id=child> <OPTION selected main-value="first">First #1</OPTION> <OPTION main-value="first">First #2</OPTION> <OPTION main-value="first">First #3</OPTION> <OPTION main-value="second">Second #1</OPTION> <OPTION main-value="third">Third #1</OPTION> <OPTION main-value="third">Third #2</OPTION> <OPTION main-value="third">Third #3</OPTION> <OPTION main-value="third">Third #4</OPTION></SELECT> </BODY></HTML>
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195417
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195450
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195455
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
jQuery подключить надо
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38195460
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Спасибо, за помощь и терпенье!
Буду подключать.
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202347
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
установил jQuery (jquery-1.9.1.js). Заработало, но не так по ссылке http://jsfiddle.net/sGPnV/1/.
1. если записать как изначально --- <select id="main"> ничего не происходит. Надо добавлять --- OnChange (<select id="main" onChange="main_change();">)
2. Если в первом списке выбираю нужное значение то во втором правильно выбирается только значение по умолчанию, остальные значения подряд, хотя в примере http://jsfiddle.net/sGPnV/1/ только те, что нужно.
3. Как обратиться к переменной из первого списка, что б сделать sql запрос и найденные значения вставить во второй список?
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202371
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
вероятно, у Вас не хватает атрибутов main-value
покажите Ваш html
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202383
Фотография re_qas
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
по п. 1
$(document).ready(function(){$('#main').change(...)})
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202388
Фотография re_qas
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
по п.3
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
 $.ajax({
        type: "POST",
        url: "function.php",
        data: {
            "test" : test
         },
        async: true,
        success: function(response) {
           	result = response;
        },
        error: function(response) {
            alert("Ошибка");
        }
    });

вернет вам что скажет function.php
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202412
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: 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.
<html>
<head>

<body bgcolor=#c0c0c0>
<script type="text/javascript">
 function main_change() {
    var val = $('#main option:selected').val(),
        selector = '#child option[main-value="' + val + '"]';
    $('#child option').removeAttr('selected').hide();
    $(selector).show();
    $(selector + ':first').attr('selected', 'selected');
}
$(function() {
    $('#main').change(main_change);
    main_change();
});
</script>

<select id="main" OnChange="main_change();">
    <option value="first">Main First</option>
    <option value="second">Main Second</option>
    <option value="third">Main Third</option>
</select>

      <select id="child">
    <option main-value="first">First #1</option>
    <option main-value="first">First #3</option>
    <option main-value="first">First #3</option>
    <option main-value="second">Second #1</option>
    <option main-value="third">Third #1</option>
    <option main-value="third">Third #2</option>
    <option main-value="third">Third #3</option>
    <option main-value="third">Third #4</option>
</select>
</body>
<script type="text/javascript" src="inc/jquery-1.9.1.js"></script>
</head>
</html>
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202437
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
подключайте jquery перед его использованием

а body внутри head это что-то новое :)
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202517
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Ух, как здорово: <body> разместил прямо в <head>.
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202572
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: 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.
<html>
<head>
<script type="text/javascript" src="inc/jquery-1.9.1.js"></script>
<script type="text/javascript">
 function main_change() {
    var val = $('#main option:selected').val(),
        selector = '#child option[main-value="' + val + '"]';
    $('#child option').removeAttr('selected').hide();
    $(selector).show();
    $(selector + ':first').attr('selected', 'selected');
}
$(function() {
    $('#main').change(main_change);
    main_change();
});
</script>
</head>

<body>
<select id="main">
    <option value="first">Main First</option>
    <option value="second">Main Second</option>
    <option value="third">Main Third</option>
</select>

      <select id="child">
    <option main-value="first">First #1</option>
    <option main-value="first">First #3</option>
    <option main-value="first">First #3</option>
    <option main-value="second">Second #1</option>
    <option main-value="third">Third #1</option>
    <option main-value="third">Third #2</option>
    <option main-value="third">Third #3</option>
    <option main-value="third">Third #4</option>
</select>
</body>
</html>


Исправил, не помогло.
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202615
Фотография re_qas
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Ferum1
Код: html
1.
2.
3.
4.
$(function() {
    $('#main').change(main_change);
    main_change();
});


Исправил, не помогло.
Код: html
1.
2.
3.
4.
$(document).ready(function() {
    $('#main').change(main_change);
    main_change();
});
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202619
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
по п.1 проблема исчезла, работает без OnChange="main_change();"
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202674
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
re_qas,
видимо с body и head намудрил, а так работают два варианта.
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202688
Фотография re_qas
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Ferum1re_qas,
видимо с body и head намудрил, а так работают два варианта.
да... и jq подключен был в конце... через ready ожидается загрузка страницы..
по п.2. лучше всего будет сделать: пока не выбран 1 селектор, то там держать только опции для 1-го селектора, при выборе второго, подставлять для второго и т.д.
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38202693
Фотография re_qas
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
по пункту 3 почитайте http://www.wisdomweb.ru/JQ/ajax.php
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38203007
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
re_qasFerum1re_qas,
видимо с body и head намудрил, а так работают два варианта.
да... и jq подключен был в конце... через ready ожидается загрузка страницы..
по п.2. лучше всего будет сделать: пока не выбран 1 селектор, то там держать только опции для 1-го селектора, при выборе второго, подставлять для второго и т.д.
Так оно так и работает (по умолчанию там первые значения подставляются)...
Когда в первом селекторе выбираю нужное значение во втором почему то все значения, только первое значение правильное
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38203036
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
чертов Internet Explorer
Код: javascript
1.
2.
3.
4.
5.
6.
7.
function main_change() {
    var val = $('#main option:selected').val(),
        selector = '#child option[main-value="' + val + '"]';
    $('#child>option').removeAttr('selected').wrap('<span>').parent().hide();
    $(selector).unwrap();
    $(selector + ':first').attr('selected', 'selected');
}
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38204138
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Паганельчертов Internet Explorer
Код: javascript
1.
2.
3.
4.
5.
6.
7.
function main_change() {
    var val = $('#main option:selected').val(),
        selector = '#child option[main-value="' + val + '"]';
    $('#child>option').removeAttr('selected').wrap('<span>').parent().hide();
    $(selector).unwrap();
    $(selector + ':first').attr('selected', 'selected');
}


Работает, Спасибо!
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38204146
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
re_qasпо пункту 3 почитайте http://www.wisdomweb.ru/JQ/ajax.php
Интересная ссыла, спасибо!
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38222772
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: 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.
39.
40.
41.
42.
43.
44.
45.
<? session_start();
header('Content-type: text/html; charset=WINDOWS-1251');
   require ('inc/authorization.inc');
   require ('inc/sql_connect.inc');

     $q1=mysql_query("SELECT * FROM f_scaner");
     $row_q1=mysql_num_rows($q1);
   ?>
<html>
<head>

<script type="text/javascript" src="inc/jquery-1.9.1.js"></script>
<script type="text/javascript" src="inc/chained.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#sn_scaner").chained("#m_scaner");
});
    </script>
</head>
<form action="add.php" method=post>
<body>
<select id="m_scaner" name="id_scaner">
<option value="">&#204;&#238;&#228;&#229;&#235;&#252; &#241;&#234;&#224;&#237;&#229;&#240;&#224;</option>
<?
 for ($i=0; $i<$row_q1; $i++)
  echo '<option value='.mysql_result($q1, $i, 'f_scaner.id_scaner').'>'.mysql_result($q1, $i, 'f_scaner.n_scaner').'</option>';
  ?>
  </select>

<select id="sn_scaner" name="id_sn">
<option value="">SN</option>
<?
     $q2=mysql_query("SELECT * FROM sn_scaner");
     $row_q2=mysql_num_rows($q2);

 for ($i=0; $i<$row_q2; $i++)
  echo '<option value='.mysql_result($q2, $i, 'sn_scaner.id_sn').'  class='.mysql_result($q2, $i, 'sn_scaner.id_scaner').'>'.mysql_result($q2, $i, 'sn_scaner.n_sn').'</option>';
  ?>
</select>
<body>
<p>
<td align="center"><input type="submit" name="exit" value="OK"></td>
</body>
</form>
</html>


как в запросе "SELECT * FROM sn_scaner" сделать не для всех, с выборкой по первому селекту (например "SELECT * FROM sn_scaner WHERE id_scaner='.sn_scaner.') ? Не хотелось бы делать выборку по всей базе.
скрипт брал http://www.appelsiini.net/download/jquery.chained.js
...
Рейтинг: 0 / 0
Как сделать два связанных выпадающих списка?
    #38223000
Ferum1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
думаю так правильнее WHERE id_scaner='.m_scaner.' , тогда из второго селекта class можно убрать
...
Рейтинг: 0 / 0
Период между сообщениями больше года.
Как сделать два связанных выпадающих списка?
    #38630865
severin_iv
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Доброго времени суток, очень помогла ссылка http://jsfiddle.net/sGPnV/1/

Мне необходимо немного дополнить функционал данной форы так чтобы в текстовое поле после этих двух списков выводился результат, который зависит от выбора в обоих select-ах, очень буду признателен если натолкнете на мысль, т.к. в java я далеко не силен.
...
Рейтинг: 0 / 0
42 сообщений из 42, показаны все 2 страниц
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как сделать два связанных выпадающих списка?
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


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