Перебор значений списка select/option
Здравствуйте, уважаемые форумчане. Прошу вашей помощи в следующем вопросе.
Есть набор данных, выбранных из MySQL, которые выводятся в select/option. Задача формы - пользователь должен расставить данные по приоритетности. <form> Расставьте значения по приоритету (назовем ее так)<br> На первом месте <select> <option></option> <option>Деньги</option> <option>Семья</option> <option>Здоровье</option> </select> На втором месте <select> <option></option> <option>Деньги</option> <option>Семья</option> <option>Здоровье</option> </select> На третьем месте <select> <option></option> <option>Деньги</option> <option>Семья</option> <option>Здоровье</option> </select> </form> Как сделать, чтобы пользователь мог выбрать пункт "деньги" только в одном select-е? Выбрал в первом - в остальных пропало. Поставил в первом на "семью" - "деньги" восстановились в остальных. Моя мысль - загрузить данные в один массив, а потом оттуда тянуть в select-ы. При событии onchange деактивировать строку массива или перенести эту строку в другой массив. При смене выбора перенесенную/неактивную строку возвращать, выбранную убирать. Но я не знаю, как это сделать технически. Буду благодарен за помощь или ссылку на учебную информацию. |
Цитата:
<!DOCTYPE html> <html> <head> <!-- <script src="http://code.jquery.com/jquery-latest.js"></script> <link rel="stylesheet" type="text/css" href="tmp.css" /> --> <style type="text/css"> </style> <script type="text/javascript"> function test(Obj) { var typ=(Obj.options[Obj.selectedIndex].innerHTML=='Деньги'); var os=Obj.parentNode.getElementsByTagName('select'); var i; for (i=0; i<os.length; i++) { if (os[i]!=Obj) { os[i].disabled=typ; } }; }; </script> </head> <body> <form> <p>Расставьте значения по приоритету (назовем ее так)<br> На первом месте </p> <select onchange='test(this)'> <option></option> <option>Деньги</option> <option>Семья</option> <option>Здоровье</option> </select> <p>На втором месте</p> <select onchange='test(this)'> <option></option> <option>Деньги</option> <option>Семья</option> <option>Здоровье</option> </select> <p>На третьем месте</p> <select onchange='test(this)'> <option></option> <option>Деньги</option> <option>Семья</option> <option>Здоровье</option> </select> </form> </body> </html> |
ksa, в данном варианте disabled запрещает сам select, а не один option - из него вообще ничего нельзя выбрать.
|
Цитата:
Либо твоя оплата. ;) |
<script> function change_me(option) { var stirng = $(option).find("option:selected").val(); var index = $("#task1 select").index(option); if(index==0) { $("#task1 select option").removeAttr("disabled"); } for(var k=1; k<$("select").length; k++) { $("#task1 select").eq(k).find("option").each(function() { if($(this).val() == stirng) { $(this).attr("disabled", "disabled"); } }); } } </script> <form id="task1"> Расставьте значения по приоритету (назовем ее так)<br> На первом месте <select onchange="change_me(this);"> <option></option> |
Часовой пояс GMT +3, время: 19:39. |