Главная Вход в систему Регистрация
Задать вопрос Консультации Пользователи Форум
О системе Помощь
Задать вопрос экспертам
Консультация № 170659
21.07.2009, 15:42
0.00 руб.
0 5 2
Компьютеры Программирование
Здравствуйте эксперты. Вопрос про формы. Начал я совсем недавно с ними разбираться, так что на мой взгяд воспрос легкий.
На странице имеется Кнопка, выпадающий список и два поля для ввода. Необходимо при выборе строки из выпадающего списка активировать или блокировать первое или второе поле ввода.
Внизу набрасал небольшой пример того что мне надо... Он не работает, но может быть он расскажет то что я не сам не рассказал.



Приложение:
<form name="form1" style="background-color: #336699 " method="post" action="">
<input type="submit" name="Submit" value="Найти">
<select
onChange="
if (form.elements[1].options.value = 'num')
{ form.elements[2].disabled='disabled';
}
else
{form.elements[3].disabled='disabled';}
"
name="combo" id="combo">
<option value="num">по номеру</option>
<option value="fam">по фамилии</option>
<option value="adress">по адресу</option>
<label>Введите строку для поиска</label>
</select>
<input name="find" type="text" id="find" size="40">
<input name="dom" type="text" id="dom" size="40">
</form>

Обсуждение

Неизвестный
21.07.2009, 18:00
общий
это ответ
Здравствуйте, Djoin.

Исправил Ваш код минимально до работоспособности. Оговорюсь сразу, что так не делают, функцию, которую Вы определили внутри onChange, как правило выносят в теги <script>, а в onChange помещают её вызов.

Приложение:
<html>
<body>

<form name="form1" style="background-color: #336699 " method="post" action="">
<input type="submit" name="Submit" value="Найти">
<select name="combo" id="combo"
onChange="
if (document.forms.form1.combo.selectedIndex == 0) {
document.forms.form1.find.disabled=false;
document.forms.form1.dom.disabled=true;
} else if (document.forms.form1.combo.selectedIndex == 1) {
document.forms.form1.find.disabled=true;
document.forms.form1.dom.disabled=false;
}
">

<option value="num">по номеру</option>
<option value="fam">по фамилии</option>

<label>Введите строку для поиска</label>
</select>
<input name="find" type="text" id="find" size="40">
<input name="dom" type="text" id="dom" size="40" disabled>
</form>

</body>
</html>
5
Спасибо! То что надо! А можете написать в мини форум пример с выносом процедуры в теги <script>?
Неизвестный
21.07.2009, 18:14
общий
А есть ли у объекта <input name="find" type="text" id="find" size="40"> свойство visible - отображение?
Неизвестный
21.07.2009, 18:27
общий
Код:

<html>
<body>
<script>
function setActiveFields(form) {

var index = form.combo.selectedIndex;
if (index  == 0) {
	  	form.find.disabled=false;
		form.dom.disabled=true;
	} else if (index == 1) {
		form.find.disabled=true;
		form.dom.disabled=false;
	}
}
</script>
<form name="form1" style="background-color: #336699 " method="post" action="">
  <input   type="submit" name="Submit" value="Найти">
  <select name="combo" id="combo" onChange="setActiveFields(this.form);">
    <option value="num">по номеру</option>
    <option value="fam">по фамилии</option>
	<label>Введите строку для поиска</label>
  </select>
  <input  name="find" type="text" id="find" size="40">
  <input  name="dom" type="text" id="dom" size="40" disabled>
</form>

</body>
</html>
Неизвестный
21.07.2009, 18:33
общий
а это простая функция для "тумблера":
Код:

function doReverseExpansion(id1,id2) {
	var elem1  = document.getElementById(id1);
	var elem2  = document.getElementById(id2);
	if (elem1.style.display == "none") {
		elem1.style.display = "block";
		elem2.style.display = "none";
	} else {
		elem1.style.display = "none";
		elem2.style.display = "block";
	}
	return false;


есть ещё свойство visibility - его тоже изменять имеет смысл, для совместимости со всеми браузерами.
Неизвестный
21.07.2009, 23:56
общий
это ответ
Здравствуйте, Djoin.
Этот код не очень с точки зрения безопасности, но вполне пойдет. Проблема безопасности в области видимости обращения к объектам по идентификатору = она будет глобальной. Если на этой же странице не будет кода, который будет одновременно использовать одноименные переменные или эти идентификаторы, то ничего не случиться. Принятое обращение getElement ById("combo"); и можно чуть чуть переписать код с учетом принятого обращения. В коде я использовал сокращенную запись ветвления (if). Я привел этот пример еще и для вашего интереса, мол можно и так! Надеюсь вам было интересно.


Приложение:
<html>
<body>

<form name="form1" style="background-color: #336699 " method="post" action="">
<input type="submit" name="Submit" value="Найти">
<select name="combo" id="combo" onChange="combo.selectedIndex==0?find.disabled=false:find.disabled=true; combo.selectedIndex==1?dom.disabled=false:dom.disabled=true;">

<option value="num">по номеру</option>
<option value="fam">по фамилии</option>

<label>Введите строку для поиска</label>
</select>
<input name="find" type="text" id="find" size="40">
<input name="dom" type="text" id="dom" size="40" disabled>
</form>

</body>
</html>
5
Спасибо
Форма ответа