VPF::Динамическое изменение доступности элемента формы

scalalaz

Дата 26.2.2010, 15:58 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 2
Регистрация: 26.2.2010

Репутация: нет
Всего: нет

Возникла такая задачка. Есть форма в форме несколько элементов select. В зависимости от выбранного значения в одном списке, нужно делать доступным либо недоступным второй список. Как повесить обработчик на изменение значений понятно. А вот как с помощью JavaScript менять свойство disabled в нужном списке не пойму. Подскажите как сделать или дайте ссылку на пример.

comtat

Дата 26.2.2010, 16:22 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 1310
Регистрация: 2.5.2006
Где: Россия, Казань

Репутация: 7
Всего: 71

Код


        var item = document.getElementById(_ID);
    item.disabled = !item.disabled;

--------------------

Рожденный в СССР !!!
ExtJS - мой фреймворк

12345c

Дата 26.2.2010, 16:22 (ссылка)

(нет голосов)

Загрузка ...

Круглый

Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

Репутация: 6
Всего: 101

объект.setAttribute('disabled', 'disabled'); , как обычно.

--------------------

Google Code Playground - онлайн-отладка своих примеров HTML+JS без регистрации, с сохранением по URL, без кириллицы. Go

scalalaz

Дата 26.2.2010, 16:31 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 2
Регистрация: 26.2.2010

Репутация: нет
Всего: нет

Вот пример

<html><head></head><body background=back.jpg>
<p>Внимание! Поля, отмеченные звёздочкой (*) обязательны для заполнения!</p>
<script language="JavaScript">
function SelectChange(element) {
var InputElement = document.getElementsByTagName("who")[0];
if (element.value == "Исходящая корреспонденция") {
InputElement.setAttribute("disabled","true");
}
else
{
InputElement.setAttribute("disabled","false");
}
return true;
}
</script>
<form action="default.asp" method="POST">
<table>
<tr><td>* Способ доставки документа: </td><td><select name="typ">
<option>
<option value="Факс">Факс
<option value="Обычная почта">Обычная почта
<option value="Заказное письмо">Заказное письмо
<option value="Прочее">Прочее
<option value="Курьерская доставка">Курьерская доставка</select></td></tr>
<tr><td>* Отправитель: </td><td><input name="snd" value="<% =FullName %>" MAXLENGTH=254></td></tr>
<tr><td>* Получатель(и): </td><td><TEXTAREA NAME="rcpt" ROWS=4 COLS=40></TEXTAREA></td></tr>
<tr><td>* Тема: </td><td><input name="sbj" MAXLENGTH=254></td></tr>
<tr><td>* Направление документа: </td><td><select name="who" OnChange="SelectChange(this)">
<option>
<option value="Внутренняя корреспонденция">Внутренняя корреспонденция
<option value="Исходящая корреспонденция">Исходящая корреспонденция
<option value="Входящая корреспонденция">Входящая корреспонденция</select></td></tr>
<tr><td> Префикс организации отправителя для исходящей корреспонденции: </td><td><select name="pref">
<option>
<option value="КП">КП
<option value="КПВ">КПВ
<option value="ИКПВ">ИКПВ
<option value="ИКПТ">ИКПТ
<option value="ИКПЕ">ИКПЕ</select></td></tr>
<tr><td>Примечание: </td><td><TEXTAREA NAME="prim" ROWS=4 COLS=40></TEXTAREA></td></tr>
</table><br>
<INPUT type=submit value="Отправить"></form>
<img src=powered.jpg>
</body></html>

Вопрос по строчкам выделенным жирным шрифтом. Как установить свойство disabled? И вообще возможно ли динамическое изменение доступности элемента?

comtat

Дата 26.2.2010, 18:42 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 1310
Регистрация: 2.5.2006
Где: Россия, Казань

Репутация: 7
Всего: 71

Код


<html><head></head><body background=back.jpg>
<p>Внимание! Поля, отмеченные звёздочкой (*) обязательны для заполнения!</p>
<script language="JavaScript">
function SelectChange(element) {
    var InputElement = document.getElementById("who");
    InputElement.disabled = (element.value == "Исходящая корреспонденция")?true:false;
    return true;
}
</script>
<form action="default.asp" method="POST">
<table>
<tr><td>* Способ доставки документа: </td><td><select name="typ">
<option>
<option value="Факс">Факс
<option value="Обычная почта">Обычная почта
<option value="Заказное письмо">Заказное письмо
<option value="Прочее">Прочее
<option value="Курьерская доставка">Курьерская доставка</select></td></tr>
<tr><td>* Отправитель: </td><td><input name="snd" value="<% =FullName %>" MAXLENGTH=254></td></tr>
<tr><td>* Получатель(и): </td><td><TEXTAREA NAME="rcpt" ROWS=4 COLS=40></TEXTAREA></td></tr>
<tr><td>* Тема: </td><td><input name="sbj" MAXLENGTH=254></td></tr>
<tr><td>* Направление документа: </td><td><select id="who" name="who" OnChange="SelectChange(this)">
<option>
<option value="Внутренняя корреспонденция">Внутренняя корреспонденция
<option value="Исходящая корреспонденция">Исходящая корреспонденция
<option value="Входящая корреспонденция">Входящая корреспонденция</select></td></tr>
<tr><td>   Префикс организации отправителя для исходящей корреспонденции: </td><td><select name="pref">
<option>
<option value="КП">КП
<option value="КПВ">КПВ
<option value="ИКПВ">ИКПВ
<option value="ИКПТ">ИКПТ
<option value="ИКПЕ">ИКПЕ</select></td></tr>
<tr><td>Примечание: </td><td><TEXTAREA NAME="prim" ROWS=4 COLS=40></TEXTAREA></td></tr>
</table><br>
<INPUT type=submit  value="Отправить"></form>
<img src=powered.jpg>
</body></html>

--------------------

Рожденный в СССР !!!
ExtJS - мой фреймворк

bars80080

Дата 26.2.2010, 20:10 (ссылка)

(голосов:2)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 44
Всего: 315

Цитата(scalalaz @ 26.2.2010, 15:31

)

getElementsByTagName("who")

Цитата(scalalaz @ 26.2.2010, 15:31

)

<select name="who"

улыбнуло

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »