Динамические поля на JavaScript

TRIAL ↓

19 Ноябрь, 2008, 12:22:04

НЕ ХУЕТА! ХУЕТА!

Группа: Джедаи

Карма: 7
Сообщений: 906
Сила слова: 0.77

Задача: сделать возможность добавлять/удалять поля для анкеты. Т.е. возможность дать более одного ответа на вопрос. Например как в резюме обычно одно поле об образовании и если хочешь добавить еще, то нажимаешь и появляется очередная форма для заполнения.

По нэту полазил, но везде ссылка на одну и ту же статью. Работает уж больно коряво, а из вас наверняка кто-то имел дело с более нормальными скриптами.


	Записан

from TRIAL with LOVE

md5 ↓

19 Ноябрь, 2008, 12:23:48 , спустя 1 минуту 44 секунды

НЕ ХУЕТА! ХУЕТА!

выезд, апартаменты, массаж, стриптиз, подружки, дорого
Группа: в ухо

Карма: не нужна
Сообщений: 10494
Сила слова: 1.19

вот пример накидал

HTML

<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>


	Записан

8: Undefined variable: str
Файл: /home/pyha/pyha.ru/forum/bbcode/Xbb/Tags/Man.php
Строка: 18
adw0rd: мудень блять, я уже фиксить стал эту фигню :)
md5: вуахахахаха

md5 ↓

19 Ноябрь, 2008, 12:25:23 , спустя 1 минуту 35 секунд

НЕ ХУЕТА! ХУЕТА!

для проверки

PHP

<?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>


	Записан

CTAPbIu_MABP ↓

19 Ноябрь, 2008, 12:42:13 , спустя 16 минут 50 секунд

НЕ ХУЕТА! ХУЕТА!

мавр
Группа: в ухо

Карма: не нужна
Сообщений: 5187
Сила слова: 1.81

разметка

Text

код

Text

$().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 ЗЫ я сам с себя в шоке


	Записан

java.lang.OutOfMemoryError

md5 ↓

19 Ноябрь, 2008, 12:46:08 , спустя 3 минуты 55 секунд

НЕ ХУЕТА! ХУЕТА!

TRIAL, у мавра это на jquery
CTAPbIu_MABP, я в шоке )


	Записан

CTAPbIu_MABP ↓

19 Ноябрь, 2008, 12:49:06 , спустя 2 минуты 58 секунд

НЕ ХУЕТА! ХУЕТА!

мавр
Группа: в ухо

Карма: не нужна
Сообщений: 5187
Сила слова: 1.81

ьлин я начал писать и так красиво получилось а потом когда '+++' придумал - ваще афигел


	Записан

java.lang.OutOfMemoryError

CTAPbIu_MABP ↓

19 Ноябрь, 2008, 02:15:31 , спустя 1 час 26 минут 25 секунд

НЕ ХУЕТА! ХУЕТА!

мавр
Группа: в ухо

Карма: не нужна
Сообщений: 5187
Сила слова: 1.81

на самом деле первый код был чистой теорией но меня так заинтересовала тема что я убил еще 15 минут на практику в результате чего ТРИАЛ получает готовый работоспособный код)))

Text

<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>

как ведите теория сильно отличается от практики

Text

$('input')

это не создание элемента а выбор

Text

$('input').attr({type:'button'})

нельзя менять тип инпута, я думал только у эксплорера нельзя, а оказалось фаерфокс тоже ругается

click пришлось заменить на bind с параметром потому что по завершению цыкла f становилась равной work и добавлялись только поля работы, а теперь при передаче через бинд создаются замыкания которое держит в себе значение итератора

и еще немного привел в красивый вид бр-ками


	Записан

java.lang.OutOfMemoryError

CTAPbIu_MABP ↓

19 Ноябрь, 2008, 02:35:15 , спустя 19 минут 44 секунды

НЕ ХУЕТА! ХУЕТА!

мавр
Группа: в ухо

Карма: не нужна
Сообщений: 5187
Сила слова: 1.81

к теме о динамике js
посмотрите как в этом плане грациозен майкрософт

http://www.clientcide.com/jsexamples/todays-javascript-wtf/


	Записан

java.lang.OutOfMemoryError

TRIAL ↓

02 Декабрь, 2008, 01:45:05 , спустя 12 дней 23 часа 9 минут 50 секунд

НЕ ХУЕТА! ХУЕТА!

Группа: Джедаи

Карма: 7
Сообщений: 906
Сила слова: 0.77

В итоге я сам додумал и дописал динамику на JavaScript
Как время будет, выложу тут готовый вариант с описанием и объяснением. Можно будет даже в статьи или готовые решения добавить или как там у нас раздел называется :)


	Записан

from TRIAL with LOVE

phpdude ↓

02 Декабрь, 2008, 01:46:40 , спустя 1 минуту 35 секунд

НЕ ХУЕТА! ХУЕТА!

я - ЭМО
Группа: в ухо

Карма: 344
Сообщений: 20780
Сила слова: 1.66

TRIAL, выкладывай. желательно на жукери, не пистаь же на клин жс :(


	Записан

забанен. могу забанить других, пишите в личку

BEER. Helping ugly people have sex since 1862.

CTAPbIu_MABP ↓

02 Декабрь, 2008, 02:26:20 , спустя 39 минут 40 секунд

НЕ ХУЕТА! ХУЕТА!

мавр
Группа: в ухо

Карма: не нужна
Сообщений: 5187
Сила слова: 1.81

http://www.clientcide.com/jsexamples/todays-javascript-wtf/

я кстати потом нашол что это за бред. это для совместимости с IE5.5 который не поддерживает метод apply


	Записан

java.lang.OutOfMemoryError

phpdude ↓

02 Декабрь, 2008, 02:34:50 , спустя 8 минут 30 секунд

НЕ ХУЕТА! ХУЕТА!

я - ЭМО
Группа: в ухо

Карма: 344
Сообщений: 20780
Сила слова: 1.66

CTAPbIu_MABP, мб еще ие3 будем поддерживать? который не поддерживает ютф-8 к сожалению... ? нахуй ие5.5 с ума чтоли все посходили, если сайты будут криво работать на них то надо просто плашку класть мол скачай нормальный браузер а не г ебаное. сори наболело.


	Записан

забанен. могу забанить других, пишите в личку

BEER. Helping ugly people have sex since 1862.

CTAPbIu_MABP ↓

02 Декабрь, 2008, 02:52:32 , спустя 17 минут 42 секунды

НЕ ХУЕТА! ХУЕТА!

мавр
Группа: в ухо

Карма: не нужна
Сообщений: 5187
Сила слова: 1.81

phpdude, да все нормально я тоже так думаю


	Записан

java.lang.OutOfMemoryError

phpdude ↓

02 Декабрь, 2008, 02:53:51 , спустя 1 минуту 19 секунд

НЕ ХУЕТА! ХУЕТА!

я - ЭМО
Группа: в ухо

Карма: 344
Сообщений: 20780
Сила слова: 1.66

я спокоен .. я спокоен ... :)))))


	Записан

забанен. могу забанить других, пишите в личку

BEER. Helping ugly people have sex since 1862.

sap ↓

02 Декабрь, 2008, 02:58:44 , спустя 4 минуты 53 секунды

НЕ ХУЕТА! ХУЕТА!

Группа: Жмурики

Карма: 40
Сообщений: 2697
Сила слова: 1.48

phpdude

TRIAL, выкладывай. желательно на жукери, не пистаь же на клин жс :(

Да в каждом посте про джаваскрипт только и слышно от тебя «жуквери, жуквери». Хватит, может? Не все фанаты этой штуки.


	Записан

Мой сайт

Страниц: [1] 2 3 ... 7

Печать

« предыдущая тема следующая тема »

	Автор	Тема: Динамические поля на JavaScript (Прочитано 6388 раз)
0 Пользователей и 1 Гость смотрят эту тему.