адача следующая:
Есть div блок. В нем содержится некие данные. Например, несколько полей, чекбокс текст и т.д., а также в блоке есть 2 кнопки "+" и "-"
Пользователь ввел данные затем нажимает + появляется такой же блок, но пустой.
нашел вот что примерно мне нужно (только в новом блоке поля со значениями, а должны быть пустыми):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Демонстрация клонирования</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
</head>
<body>
<script>
function droptr(btn){
if(document.getElementById) {
tr = btn;
while (tr.tagName != 'TR') tr = tr.parentNode;
tr.parentNode.removeChild(tr);
checkForLast();
}
}
function addtr(btn){
if(document.getElementById) {
tr = btn;
while (tr.tagName != 'TR') tr = tr.parentNode;
var idSuffix = Math.round(Math.random()*1000);
var newTr = tr.parentNode.insertBefore(tr.cloneNode(true),tr.nextSibling);
thisChilds = newTr.getElementsByTagName('td');
checkForLast();
}
}
function checkForLast(){
btns = document.getElementsByName('drop');
for (i = 0; i < btns.length; i++){
btns[i].disabled = (btns.length == 1) ? true : false;
}
}
</script>
<form action="" method="post">
<table>
<tr>
<td><input type="text" name="nameclone[]"></td>
<td>
<INPUT onclick=droptr(this); type=button disabled=true value="-" name=drop> <INPUT onclick=addtr(this); type=button value="+">
</td>
</tr>
</table>
<input type="submit" value="Отправить">
</form>
</body>
</html>
В общем, нужно сделать так чтобы поля пустыми новые были и желательно избавиться от табличной верстки, т.е. сделать все на div, а не на tr.
Пробовал с нуля написать:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Демонстрация клонирования</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
</head>
<body>
<form action="" method="post">
<div id="lib"><input type="text" size="6" name="nameclone[]" value=""><br>
</div>
<div id="lib2"></div>
<input type="button" value="Add" onClick="if(lb)lb.innerHTML+=text2add">
<script>
var lb=document.getElementById('lib')
var text2add=lb.innerHTML
function cloneIt(){
lb.innerHTML=cloneNode(text2add);
// text2add=text2add.search(/([\w\W]*name=[^\d]+)(\d+)([\w\W]*)/gi)
// text2add=RegExp.$1+(1+parseInt(RegExp.$2))+RegExp.$3
// lb.innerHTML+=text2add
}
</script>
<input type="submit" value="Отправить">
</form>
</body>
</html>
Но в js не силен и скрипт не правильно работает, все поля пустые, даже те что заполнены были стают, да и кнопку только одну вывел.
Помогите плиз.