hamm-burger Сообщение 10/08/2010 08:21 Копия темы
хелп ми!!!хтмл-форма и яваскрипт Нужен скриптик, чтоб в зависимости от выбора опции в селекте появлялись разные дополнительные поля. Обшарил весь яндекс, нашёл 2 варианта:
www.scriptic.ru/form/modi...
ruseller.com/lessons.php?...

но и тот и другой вариант не работают в ие. В яваскрипте не шарю абсолютно...подскажите, пожалуйста, рабочее кроссбраузерное решение или как нужно подправить эти скрипты...
очень нужно!!!!!

vah-smile Сообщение 10/08/2010 11:48 Копия темы
<script>
var last_point = 0;
function f_x ()
{
      var x = document.getElementById("a1").value;
      var text = document.getElementById("text");
      var div = document.getElementById(x).style;

      text.value = x;

      if (last_point == 0)
      {
            div.display = "block";
      }
      else
      {
            var last_div = document.getElementById(last_point).style;
            last_div.display = "none";
            div.display = "block";
      }

      last_point = x;
}
</script>

<select id="a1" onchange="f_x();">
      <option value="0">Выберите вариант</option>
      <option value="1">Красный</option>
      <option value="2">Зеленый</option>
      <option value="3">Синий</option>
</select>

<form>
      <input type="text" id="text" />
</form>

<div style="width: 100px; height: 100px; background-color: #FF0000; display: none;" id="1"></div>
<div style="width: 100px; height: 100px; background-color: #00FF00; display: none;" id="2"></div>
<div style="width: 100px; height: 100px; background-color: #FF00FF; display: none;" id="3"></div>

u1tr0n Сообщение 10/08/2010 11:54 Копия темы
<script type="text/javascript" src="code.jquery.com/jquery-1....
<script language="javascript">
function modform()
{
switch($('#formtype option:selected').val())
{
case '1':
$("#dynamicform").html("
текст: <input type=\"text\" name=\"text\" id=\"text\" />")
break;
case '2':
$("#dynamicform").html("
Телефон <input type=\"text\" name=\"phone\" id=\"phone\" />")
break;
case '3':
$("#dynamicform").html("
Е-Mail: <input type=\"text\" name=\"mail\" id=\"mail\" />")
break;
}
}
</script>
<form method="get">
<select name="formtype" id="formtype" onchange="modform()">
       <option value="1">Первый вариант</option>
            <option value="2">второй вариант</option>
            <option value="3">третий вариант</option>
      </select>
      <div id="dynamicform"></div>
      <input name="" type="submit" value = "Отправить" />
</form>

u1tr0n Сообщение 10/08/2010 11:59 Копия темы
парсер дурак :(
код и работу можно глянуть тут: ultron.com.ua/free/1.php

vah-smile Сообщение 10/08/2010 12:10 Копия темы
В задании стояло "хтмл-форма и яваскрипт", а то что Вы описали – это уже JQUERY! Хоча согласен – можно и так. :)

u1tr0n Сообщение 10/08/2010 12:31 Копия темы
да но по второй ссылке автора пример именно на JQ. И кстати в твоем примере вообще нет динамических полей ;)

vah-smile Сообщение 10/08/2010 12:45 Копия темы
Я просто показал идею решения проблемы!
А насчет динамики – согласен. Будут статические поля, которые можно просто прописать в тегы <DIV> с id="1"...id="3"! Пример конечно не очень хорош, если будет много скрытых элементов, но на чистом JavaScript – это помоему единственный вариант!

u1tr0n Сообщение 10/08/2010 13:04 Копия темы
function changeform()
{
switch(document.getElementById("formtype").value)
{
case '1':
document.getElementById("dynamicform").innerHTML = "
Телефон <input type=\"text\" name=\"phone\" id=\"phone\" />";
break;
case '2':
document.getElementById("dynamicform").innerHTML = "
Телефон <input type=\"text\" name=\"mail\" id=\"mail\" />";
break;
case '3':
document.getElementById("dynamicform").innerHTML = "
Телефон <input type=\"text\" name=\"text\" id=\"text\" />";
break;
}
}

на чистом JS можно так, но не люблю я чистый JS :(

hamm-burger Сообщение 10/08/2010 13:07 Копия темы
Спасибо огромное! выручили :-)

vah-smile Сообщение 10/08/2010 13:30 Копия темы
упс... Про innerHTML что-то не подумал...
PS: Наверное не следует мне седать за комп после пива... :)

hamm-burger Сообщение 10/08/2010 13:31 Копия темы
и ещё один вопросец))) Илья, если по вашему первому варианту решения идти, и мне нужно вывести вот такую вещь:
case '2':
$("#dynamicform").html("<label>Введите текст:</label><textarea name=\"text\"></textarea><script type=\"text/javascript\">CKEDITOR.replace('text');</scr ipt>")

то возникает косяк, комп считает </script> концом js кода...Соответственно вопрос: как в этом случае прицепить визуальный редактор? в какие-то хитрые кавычки его загнать нужно?

u1tr0n Сообщение 10/08/2010 13:36 Копия темы
там ненужен <script></script> но нужно убрать из под скобок:
$("#dynamicform").html("<label>Введите текст:</label><textarea name=\"text\"></textarea>"+CKEDITOR.replace('text' ))

hamm-burger Сообщение 10/08/2010 13:42 Копия темы
хм...не работает....при выборе "второй вариант" вообще ничего не появляется, даже тектареа...

vah-smile Сообщение 10/08/2010 13:47 Копия темы
А зачем Вы закрываете </SCRIPT>? Ваша ошибка в том, что Javascript в Javascript не вставляется! Для этого используются функции!   
И еще: Лутше чередовать " с '

function modform ()
{
........
$("#dynamicform").html ("
      <label>Введите текст:</label>
      <textarea name='text'></textarea>
      " + my (); )   
........
}

function my ()
{
      CKEDITOR.replace("text"');
}

hamm-burger Сообщение 10/08/2010 13:51 Копия темы
тоже не помогло...вероятно, руки не оттуда))))

vah-smile Сообщение 10/08/2010 13:51 Копия темы
В предпоследней срочке сделал опечатку! Нужно так:

CKEDITOR.replace("text");

u1tr0n Сообщение 10/08/2010 13:54 Копия темы

case '2':
document.getElementById("dynamicform").innerHTML = "<label>Введите текст:</label><textarea name=\"text\"></textarea>";
var editor = CKEDITOR.replace('text' );
break;   


а так?

hamm-burger Сообщение 10/08/2010 13:56 Копия темы
лишнюю кавычку я заметил, убрал...всё равно беда...
в таком виде <textarea name='text'></textarea> " + my (); не работает даже и "первый вариант"
а если убрать точку с запятой в конце, то первый работает, а второй нет...

vah-smile Сообщение 10/08/2010 13:57 Копия темы
Вот, держи:

<script type="text/javascript" src="code.jquery.com/jquery-1....
<script language="javascript">
function modform()
{
switch($('#formtype option:selected').val())
{
case '1':
$("#dynamicform").html("
текст: <input type='text'>" + my())
break;
case '2':
$("#dynamicform").html("
Телефон <input type='text'>" + my())
break;
case '3':
$("#dynamicform").html("
Е-Mail: <input type='text'>" + my())
break;
}
}

function my ()
{
   alert ("YES!");
   return "";
}

</script>
</head>

<body>
<form method="get">
<select name="formtype" id="formtype" onchange="modform()">

       <option value="1">Первый вариант</option>
            <option value="2">второй вариант</option>
            <option value="3">третий вариант</option>
      </select>
      <div id="dynamicform"></div>
      <input name="" type="submit" value = "Отправить" />
</form>

vah-smile Сообщение 10/08/2010 13:58 Копия темы
Смотри выше. У функции my () нужно передавать пустой параметр:

return "";

hamm-burger Сообщение 10/08/2010 13:59 Копия темы
разобрался)))))) косяк был в том, что + my () нужно было сделать за скобкой, вот так:
$("#dynamicform").html("<label>Введите текст:</label><textarea name='text'></textarea>")+ my ()

спасибо ещё раз!!!! я вам обоим плюсанул в карму

u1tr0n Сообщение 10/08/2010 14:02 Копия темы
на самом деле ненадо было плюса и лишней функции

document.getElementById("dynamicform").innerHTML = "<label>Введите текст:</label><textarea name=\"text\"></textarea>";
var editor = CKEDITOR.replace('text' );   

так проще и оптимизированнее ;)

hamm-burger Сообщение 10/08/2010 14:04 Копия темы
да, так и сделал. Но теперь вижу ещё одну проблемку: эти поля не обрабатываются, т.е. обработчик формы не видит, что они вообще есть. и при просмотре кода страницы их тоже не видно. как быть? во я нуб, да пацаны?)))))

u1tr0n Сообщение 10/08/2010 14:22 Копия темы
обычный просмотр исходного кода их и не увидит ведь он загружает страницу сначала, а поля добавляются потом в ФФ есть плагин Web-developer он умеет показывать исходный код сгенерированного документа, незаменимая вещь при отладки динамических скриптов, для проверки я использовал стаднартную форму с GET запросом если у вас динамические поля невидны обработчиком то или у вас хитрая cms или <div id="dynamicform"></div>   находится вне тега <form>

vah-smile Сообщение 10/08/2010 14:35 Копия темы
Возможно у тебя переменные стоят как локальные, а их нужно сделать как глобальные!
Самый простой вариант проверить то, видит ли функция некоторую переменную это в сомнительном месте написать:

alert (переменная);

Если не видит – прийдется делать переменную как глобальную, или же передавать параметр функции! Второй вариант лутше!

hamm-burger Сообщение 10/08/2010 14:46 Копия темы
аааа...пардонъ)))))) всё, к вечеру мозг уже отказывается работать...ваш код поставил и забыл в обработчике имена переменных поменять ))))) всё отлично щас)))