Модераторы: Sardar, Aliance

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Динамично показывать элементы формы, по состоянию select'а 
:(
    Опции темы
starmaster
  Дата 2.3.2005, 12:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


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

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



Добрый день, вот возникла небольшая проблема, код начну:
Код

<form method="post" action="...">
<select name="somename">
<option value="opt1">1
<option value="opt2">2
<option value="opt3">3
</form>
</select>

Как при выборе какого-нибудь пункта меню убирать/вставлять элементы в форму?
Заранее благодарю!
PM MAIL WWW ICQ   Вверх
GoodBoy
Дата 2.3.2005, 12:09 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Главный джедай
****


Профиль
Группа: Модератор
Сообщений: 3886
Регистрация: 8.1.2003
Где: КМВ

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



Цитата(starmaster @ 2.3.2005, 12:04)
Как при выборе какого-нибудь пункта меню убирать/вставлять элементы в форму?

А можно немного по-конкретнее - что именно требуется?


--------------------
Чем дальше в лес, тем толще партизаны...

Цитата(igorold @  1.5.2016,  17:40 Найти цитируемый пост)
Индейцы не обратили внимания на поток беженцев из Европы… Теперь они живут в резервациях. 
PM MAIL   Вверх
starmaster
Дата 2.3.2005, 15:31 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


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

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



Ну допустим, если выбран 1 пункт меню, то в форму вставляется текстовое поле. Если выбран второй пункт меню, то, допустим, текстовое поле убирается и появляется какой-нибудь radio button и check box...

Это сообщение отредактировал(а) starmaster - 2.3.2005, 15:31
PM MAIL WWW ICQ   Вверх
batigoal
Дата 2.3.2005, 16:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Нелетучий Мыш
****


Профиль
Группа: Участник Клуба
Сообщений: 6423
Регистрация: 28.12.2004
Где: Санктъ-Петербургъ

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



Тут был пример:
http://www.rgagnon.com/jsdetails/js-0086.html
Добавлено @ 16:15
Правда, в моем проекте это делалось совсем по другому, через стили...


--------------------
"Чтобы правильно задать вопрос, нужно знать большую часть ответа" (Р. Шекли)
ЖоржЖЖ
PM WWW   Вверх
batigoal
Дата 2.3.2005, 16:44 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Нелетучий Мыш
****


Профиль
Группа: Участник Клуба
Сообщений: 6423
Регистрация: 28.12.2004
Где: Санктъ-Петербургъ

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



Вот так:

Код

<link rel="stylesheet" type="text/css" href="style.css">

<html>
<body>
<select id='sel' onChange='showHidden(this.selectedIndex);'>
<option>0</option>
<option>1</option>
</select>
<input type='text' id='first' class='SHOWN' value="text">
<input type='button' id='second' class='HIDDEN' value="Button">
</body>
</html>


Скрипты:
Код

function hideAll()
{
   hide('first');
  hide('second');
}
function hide(id)
{
document.getElementById(id).className = 'HIDDEN';
}
function showHidden(num)
{
hideAll();
if(num==0) document.getElementById('first').className = 'SHOWN';
if(num==1) document.getElementById('second').className = 'SHOWN';
}


Стили:
Код

.HIDDEN{
display: none;
}

.SHOWN{
height: 20px;
}

И заодно объясните мне, как отменять display: none smile
Критика горячо приветствуется. Это один из моих первых скриптов smile

Или тебе надо не скрывать, а именно удалять?

Это сообщение отредактировал(а) Lamer George - 2.3.2005, 16:46


--------------------
"Чтобы правильно задать вопрос, нужно знать большую часть ответа" (Р. Шекли)
ЖоржЖЖ
PM WWW   Вверх
starmaster
Дата 2.3.2005, 17:24 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


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

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



Lamer George
Скрывать... ну есть такие скипты же... например в американских... выбираешь страну... если Америка, то появляется новое меню со штатами, а если нет, то меню со штатами не увидишь...
PM MAIL WWW ICQ   Вверх
batigoal
Дата 2.3.2005, 17:38 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Нелетучий Мыш
****


Профиль
Группа: Участник Клуба
Сообщений: 6423
Регистрация: 28.12.2004
Где: Санктъ-Петербургъ

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



Ну так здесь так и есть, только некрасиво и стиль плохой smile


--------------------
"Чтобы правильно задать вопрос, нужно знать большую часть ответа" (Р. Шекли)
ЖоржЖЖ
PM WWW   Вверх
Aliance
Дата 4.3.2005, 19:11 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


I ♥ <script>
****


Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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



О стилях лучше забыть! Т.к. эти элементы будут учавстовать в коллекциях формы на странице + некорректное позиционирование =)

Пользуемся поиском, я уже таких 2 кода за посл. месяц дал. Ладно повторюсь:

Код

<HTML>
<HEAD>
<title>Тест</title>
<script type="text/javascript">
function change_inp(chooser) {
var elem = document.getElementById("block");
var db = chooser.options[chooser.selectedIndex].value;
if (db != "") {
   switch (db) {
     case "inp" :
       elem.innerHTML = '<INPUT type="text">';
       break;
     case "chk" :
       elem.innerHTML = '<INPUT type="checkbox">';
       break;
     default:
       elem.innerHTML = 'Пусто...';
  }
}
}
</script>
</HEAD>

<BODY>

<form name="f1" action="">
<select name="s1" onchange="change_inp(this)">
 <option name="pict" value="">Выбирите элемент</option>
 <option name="pict" value="inp">Input</option>
 <option name="pict" value="chk">Checkbutton</option>
</select>
</form>

<div id="block" style="border: 1px solid red">
Пусто...
</div>

</BODY>
</HTML>

Добавлено @ 19:13

PS: канечно, можно добавлять элементы прямо в эту формы. Тогда, лучше использовать не innerHTML, а appendChild()

Это сообщение отредактировал(а) Aliance - 4.3.2005, 19:12
PM MAIL WWW ICQ Skype   Вверх
batigoal
Дата 4.3.2005, 19:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Нелетучий Мыш
****


Профиль
Группа: Участник Клуба
Сообщений: 6423
Регистрация: 28.12.2004
Где: Санктъ-Петербургъ

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



А innerHTML любой браузер понимает?
Добавлено @ 19:14
Цитата(Aliance @ 4.3.2005, 19:11)
некорректное позиционирование

Почему? Из-за прописанного height?

Это сообщение отредактировал(а) Lamer George - 4.3.2005, 19:15


--------------------
"Чтобы правильно задать вопрос, нужно знать большую часть ответа" (Р. Шекли)
ЖоржЖЖ
PM WWW   Вверх
Aliance
Дата 4.3.2005, 19:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


I ♥ <script>
****


Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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



Цитата(Lamer @ 4.3.2005, 19:14)
А innerHTML любой браузер понимает?

NN3+ и IE4+ точно должны.


Цитата(Lamer @ 4.3.2005, 19:14)
Почему? Из-за прописанного height?

Из-за различной совместимости со стандартами CSS. Хотя, при наличии <!DOCTYPE> такой проблемы не будет, но неивестно как оно среагирует на это. В общем милипиксели smile Но все же...

Это сообщение отредактировал(а) Aliance - 4.3.2005, 19:28
PM MAIL WWW ICQ Skype   Вверх
batigoal
Дата 4.3.2005, 19:21 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Нелетучий Мыш
****


Профиль
Группа: Участник Клуба
Сообщений: 6423
Регистрация: 28.12.2004
Где: Санктъ-Петербургъ

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



Цитата(Aliance @ 4.3.2005, 19:18)
Да, это метод DOM

Хм... Сейчас не помню, но по-моему, в книге Гудмэна было написано, что это для IE. И в спецификации DOM я его не нашел. Правда, DOM1.


--------------------
"Чтобы правильно задать вопрос, нужно знать большую часть ответа" (Р. Шекли)
ЖоржЖЖ
PM WWW   Вверх
Aliance
Дата 4.3.2005, 19:30 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


I ♥ <script>
****


Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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



Цитата(Lamer @ 4.3.2005, 19:21)
Хм... Сейчас не помню, но по-моему, в книге Гудмэна было написано, что это для IE. И в спецификации DOM я его не нашел. Правда, DOM1.

Ты заставил меня усомниться, покопалмся в литератоуре - не нашел того, что это DOM метод =) Но он совместимый (читай выше, отредактировал). Я всегда писал под него, жалоб небыло smile
MSDN молчит =/
PM MAIL WWW ICQ Skype   Вверх
batigoal
Дата 5.3.2005, 17:58 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Нелетучий Мыш
****


Профиль
Группа: Участник Клуба
Сообщений: 6423
Регистрация: 28.12.2004
Где: Санктъ-Петербургъ

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



Aliance
Ага, ясно. Спасибо.

P.S. Ух ты, как теперь код красиво рисуется! smile


--------------------
"Чтобы правильно задать вопрос, нужно знать большую часть ответа" (Р. Шекли)
ЖоржЖЖ
PM WWW   Вверх
Aliance
Дата 5.3.2005, 21:41 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


I ♥ <script>
****


Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

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



innerHTML - оф. не входит в DOM методы, но поддерживается всеми браузерами

ЗЫ: За разъяснения спасибо Sardar`у :-)
Добавлено @ 21:42

А мне не нравиться в новой подствеки прокрутка smile
PM MAIL WWW ICQ Skype   Вверх
Pena
Дата 31.10.2006, 02:37 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


КорнеплодЪ
*


Профиль
Группа: Участник
Сообщений: 161
Регистрация: 20.4.2006
Где: эРэФия, аул Москв а...

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



А как сделать, чтобы при пометке\снятии галочки с checkbox'a, появлялась\исчезала строка ввода: <input type="text">? Я пытался вышенаписаное ковырять, но чёт ни к чему не привело это(

Это сообщение отредактировал(а) Pena - 1.11.2006, 11:16
--------------------
Самовар по всем вопросам - сильно не ругайте 
PM   Вверх
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.0636 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.