HTML формы

Статус
В этой теме нельзя размещать новые ответы.
3

31ReG

Создатель
Регистрация
17 Авг 2008
Сообщения
11
Реакции
0
у меня есть вопрос связанный с htlm формой вида select.
вот простая форма select
PHP: 
<SELECT NAME="selection"> 
<OPTION VALUE="option1" checked>Вариант 1 
<OPTION VALUE="option2">Вариант 2
<OPTION VALUE="option3">Вариант 3 
</SELECT>
подскажите как мне сделать чтоб при выборе Варианта 2 у меня ниже было написано например: Вариант 2 выбирать временно нельзя.
 
Вообще логичнее было бы просто добавить в вариант 2 аттрибут disabled="disabled" (см. Для просмотра ссылки Войди или Зарегистрируйся)

А так JavaScriptом можно:


<SELECT NAME="selection" onchange="if (document.getElementById('option2').selected) {document.getElementById('option2').selected=false;document.getElementById('option1').selected=true;alert('You can't select option 2 please choose another option!');}">
<OPTION VALUE="option1" id="option1" checked>Вариант 1
<OPTION VALUE="option2" id="option2">Вариант 2
<OPTION VALUE="option3">Вариант 3
</SELECT>

вот, но не проверял :)
 
У меня что-то не заработало :)
Поэтому написал такое:

Код: 
  <script type="text/javascript">
    function checkSelected(id) {
      name = document.form.selection.options[id].text;
      document.getElementById("message").innerHTML = "You can't select <b>" + name + "</b> temporarily!";
    }
  </script>

  <form name="form">
    <select name="selection" onchange="checkSelected(document.form.selection.selectedIndex);">
      <option value="option1">Case 1</option>
      <option value="option2">Case 2</option>
      <option value="option3">Case 3</option>
    </select>
  </form>

  <div id="message"></div>
Работает не только при выборе варианта №2, но и любого другого ;)
 
Поправил свой вариант :)))

Код: 
<html>
<head></head>
<body>
		
<script type="text/javascript">
				
    function handleOnChangeEvent() {
        var firstOption = document.getElementById('option1');
        var disabledOption =  document.getElementById('option2');
	if (disabledOption.selected) {
	    disabledOption.selected = false;
	    firstOption.selected = true; 
	    alert('You can\'t select option 2 please choose another option!');
	}
    }
</script>
		
<SELECT NAME="selection" onchange="handleOnChangeEvent()">
<option VALUE="option1" id="option1" checked>Вариант 1</option>
<option VALUE="option2" id="option2">Вариант 2</option>
<option VALUE="option3">Вариант 3</option>
</SELECT> 

</body>
</html>
 
megadude: а можеш написать такоеже ток чтоб сообщение выводилось только при выборе напимер второго варианта
 
HTML остается тот же самый, а в яваскрипт добавляется одно условие:

Код: 
  <script type="text/javascript">
    function checkSelected(id) {
      if (id == 1) {
        name = document.form.selection.options[id].text;
        document.getElementById("message").innerHTML = "You can't select <b>" + name + "</b> temporarily!";
      }
    }
  </script>
id должно быть 1 для второго варианта, 2 - для третьего и т.д. потому как нумерация начинается с 0.

Кстати - ты хочешь напрочь запретить выбирать Вариант 2(как в коде коллеги braindancer-a) или просто выводить сообщение о том, что его выбирать нельзя, как у меня? :))))
 
  • Заблокирован
  • #7
Кстати, с точки зрения юзабилити (да и безопасности) лучше вообще к чертям убрать варианты, которые нельзя выбирать. Вот кликну правой клавишей по твоей странице и попрошу мой любимый браузер Опера джаваскрипты не выполнять на ней :)
 
Очень правильное замечание. :ay:
Никогда не надо надеяться на яваскрипт - любые данные приходящие от юзеров ВСЕГДА надо проверять на серваке. ПХП никакие шаловливые ручки не отключат, кроме своих.
Яваскрипт - это навесные понты :) Красиво, иногда удобно, но не более того.
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху