Задача: сделать возможность добавлять/удалять поля для анкеты. Т.е. возможность дать более одного ответа на вопрос. Например как в резюме обычно одно поле об образовании и если хочешь добавить еще, то нажимаешь и появляется очередная форма для заполнения.
По нэту полазил, но везде ссылка на одну и ту же статью. Работает уж больно коряво, а из вас наверняка кто-то имел дело с более нормальными скриптами.
новые сообщения
ответы на мои сообщения
избранное
скрытые темы
случайный топик
открыть всё в новых вкладках
Форум → Программирование → JavaScript → Динамические поля на JavaScript
Динамические поля на JavaScript
-
Сообщения:
988
Репутация:
N
Группа:
Джедаи
-
Сообщения:
11960
Репутация:
N
Группа:
в ухо
19 ноября 2008 г. 12:23, спустя 1 минуту 44 секунды
вот пример накидал<form action="" method="post" id="myform">
<input type="text" name="field[]">
</form>
<a href="#" onclick="AddMore();return(false);">добавить</a>
<script type="text/javascript">
function AddMore()
{
var form = document.getElementById('myform');
var field = document.createElement('input');
field.type = 'text';
field.name = 'field[]';
form.appendChild(field)
}
</script>все умрут, а я изумруд -
Сообщения:
11960
Репутация:
N
Группа:
в ухо
19 ноября 2008 г. 12:25, спустя 1 минуту 35 секунд
для проверки
<?php
print_r($_POST);
?>
<form action="" method="post" id="myform">
<input type="text" name="field[]">
<input type="submit">
</form>
<a href="#" onclick="AddMore();return(false);">добавить</a>
<script type="text/javascript">
function AddMore()
{
var form = document.getElementById('myform');
var field = document.createElement('input');
field.type = 'text';
field.name = 'field[]';
form.appendChild(field)
}
</script>все умрут, а я изумруд -
Сообщения:
5305
Репутация:
N
Группа:
в ухо
19 ноября 2008 г. 12:42, спустя 16 минут 50 секунд
разметка
<form action="php_self"/>
</form>
код
$().ready(function(){
var fields = {'grad':0, work:0} // тут перечисляешь все поля
for(f in fields){
$('input').attr({type:'button'}).click(function(){
$('input').attr({type:'text',name:fields[f]+++'_'+f}).insertBefore(this);
}).appentdTo('form').click();
}
})
PS ЗЫ я сам с себя в шоке -
Сообщения:
11960
Репутация:
N
Группа:
в ухо
19 ноября 2008 г. 12:46, спустя 3 минуты 55 секунд
TRIAL, у мавра это на jquery
CTAPbIu_MABP, я в шоке )все умрут, а я изумруд -
Сообщения:
5305
Репутация:
N
Группа:
в ухо
19 ноября 2008 г. 12:49, спустя 2 минуты 58 секунд
ьлин я начал писать и так красиво получилось а потом когда '+++' придумал - ваще афигел
-
Сообщения:
5305
Репутация:
N
Группа:
в ухо
19 ноября 2008 г. 14:15, спустя 1 час 26 минут 25 секунд
на самом деле первый код был чистой теорией но меня так заинтересовала тема что я убил еще 15 минут на практику в результате чего ТРИАЛ получает готовый работоспособный код)))
<html>
<head>
<script src="jquery-1.2.6.js"></script>
<script>
$().ready(function(){
var fields = {grad:0, work:0} // тут перечисляешь все поля
for(f in fields){
$("<input type='button'/>").attr({value:'добавить '+f}).bind("click", f, function(e){
$("<input type='text'/>").attr({name:e.data+'['+fields[e.data]+++']',value:e.data+' '+fields[e.data]}).insertBefore(this).before('<br />');
}).appendTo('form').after('<br />').click();
}
})
</script>
</head>
<body>
<form action="php_self">
</form>
</body>
</html>
как ведите теория сильно отличается от практики
это не создание элемента а выбор$('input')
нельзя менять тип инпута, я думал только у эксплорера нельзя, а оказалось фаерфокс тоже ругается$('input').attr({type:'button'})
click пришлось заменить на bind с параметром потому что по завершению цыкла f становилась равной work и добавлялись только поля работы, а теперь при передаче через бинд создаются замыкания которое держит в себе значение итератора
и еще немного привел в красивый вид бр-ками -
Сообщения:
5305
Репутация:
N
Группа:
в ухо
19 ноября 2008 г. 14:35, спустя 19 минут 44 секунды
к теме о динамике js
посмотрите как в этом плане грациозен майкрософт
http://www.clientcide.com/jsexamples/todays-javascript-wtf/ -
Сообщения:
988
Репутация:
N
Группа:
Джедаи
2 декабря 2008 г. 13:45, спустя 12 дней 23 часа 9 минут
В итоге я сам додумал и дописал динамику на JavaScript
Как время будет, выложу тут готовый вариант с описанием и объяснением. Можно будет даже в статьи или готовые решения добавить или как там у нас раздел называется :)from TRIAL with LOVE -
Сообщения:
26646
Репутация:
N
Группа:
в ухо
2 декабря 2008 г. 13:46, спустя 1 минуту 35 секунд
TRIAL, выкладывай. желательно на жукери, не пистаь же на клин жс :(Сапожник без сапог -
Сообщения:
5305
Репутация:
N
Группа:
в ухо
2 декабря 2008 г. 14:26, спустя 39 минут 40 секунд
http://www.clientcide.com/jsexamples/todays-javascript-wtf/
я кстати потом нашол что это за бред. это для совместимости с IE5.5 который не поддерживает метод apply -
Сообщения:
26646
Репутация:
N
Группа:
в ухо
2 декабря 2008 г. 14:34, спустя 8 минут 30 секунд
CTAPbIu_MABP, мб еще ие3 будем поддерживать? который не поддерживает ютф-8 к сожалению… ? нахуй ие5.5 с ума чтоли все посходили, если сайты будут криво работать на них то надо просто плашку класть мол скачай нормальный браузер а не г ебаное. сори наболело.Сапожник без сапог
-
Сообщения:
5305
Репутация:
N
Группа:
в ухо
-
Сообщения:
26646
Репутация:
N
Группа:
в ухо
2 декабря 2008 г. 14:53, спустя 1 минуту 19 секунд
я спокоен .. я спокоен … :)))))Сапожник без сапог
-
Сообщения:
2701
Репутация:
N
Группа:
Кто попало
2 декабря 2008 г. 14:58, спустя 4 минуты 53 секунды
TRIAL, выкладывай. желательно на жукери, не пистаь же на клин жс :(
Да в каждом посте про джаваскрипт только и слышно от тебя «жуквери, жуквери». Хватит, может? Не все фанаты этой штуки.
Пожалуйста, авторизуйтесь, чтобы написать комментарий!