Форум

HedgehogNSK · #1 (**permalink**) 08.06.2010, 09:12

К примеру есть таблица:

<table name='tab1' border='1'align='left'>
<tr>
   <td><input type='text' name='1'></td>
   <td><input type='checkbox' name='2'></td>
   <td><input type='textarea' name='3'></td>
</tr>
</table>

И есть кнопочка:

<input type='button' value='Ещё'>

Как сделать так, чтобы при нажатии на кнопочку "Ещё", в таблице добавлялась ещё одна строка аналогичная той что уже есть?
Выглядит достаточно просто, но мои скромные знания языка не позволяют этого сделать. Помогите, пожалста.=)

exec · #2 (**permalink**) 08.06.2010, 09:17

var node = document.createElement('td');
node.innerHTML = 'Содержимое';
document.tabl.getElementsByTagName('tr')[0].appendChild(node);

HedgehogNSK · #3 (**permalink**) 08.06.2010, 09:48

Вставил ваш код так:

<script language="JavaScript">
 function add(){
var node = document.createElement('td'); 
node.innerHTML = "<input type='text' name='1'>"; 
document.tabl.getElementsByTagName('tr')[0].appendChild(node);
}
</script>

И использовал так:

<table name='tabl' border='1'align='left'>
<tr>
	<td><input type='text' name='1'></td>
</tr>
</table>
<input type='button' value='Ещё' onClick='add();'>

Компилятор ругается: "Ошибка: 'document.tabl' - есть null или не является объектом" Спрашивается, где я накосячил?=(

Skipp · #4 (**permalink**) 08.06.2010, 09:52

Эту строку так

<table  id='tabl' border='1'align='left'>

а ту в которой ошибка, так

document.getElementById('tabl').getElementsByTagName('tr')[0].appendChild(node);

HedgehogNSK · #5 (**permalink**) 08.06.2010, 10:21

Спасибо. В принципе заработало. Единственный минус, что код добавляет TD'шку (на сколько я разобрался в коде). А мне нужна новая строка в таблицу, то есть TR'ка.

Skipp · #6 (**permalink**) 08.06.2010, 10:30

Так?

<script language="JavaScript">
 function add(){
var nodet = document.createElement('tr'); 
var node = document.createElement('td'); 
node.innerHTML = "<input type='text' name='1'>";
document.getElementById('tabl').appendChild(nodet);
nodet.appendChild(node);
}

</script>

HedgehogNSK · #7 (**permalink**) 08.06.2010, 10:55

Теперь совсем ничего не добавляет и ошибок никаких не выдаёт.

HedgehogNSK · #8 (**permalink**) 08.06.2010, 11:11

Спасибо большое за помощь. Пока с тем что вы написали разбирался, написал немного по-другому.=)

<script language="JavaScript">
 function add(){
var addTR = document.getElementById('tabl').insertRow(-1); 
var addTD =addTR.insertCell(-1); 
addTD.innerHTML = "<input type='text' name='1'>";
}
</script>

Skipp · #9 (**permalink**) 08.06.2010, 11:15

Как же не работает?

<html>
<head>
<script language="JavaScript">
 function add(){
var nodet = document.createElement('tr'); 
var node = document.createElement('td'); 
node.innerHTML = "<input type='text' name='1'>";
document.getElementById('tabl').appendChild(nodet);
nodet.appendChild(node);
}
</script>
</head>
<body>
<table id='tabl' border='1'align='left'>
<tr>
	<td><input type='text' name='1'></td>
</tr>
</table>
<input type='button' value='Ещё' onClick='add();'>
</body>
</html>

HedgehogNSK · #10 (**permalink**) 08.06.2010, 11:23

Я использую EditPlus как редактор в нём не сработало. В опере работает. Извенити, сразу не проверил.=) В IE'шнике тоже не сработало. Ещё раз спасибо за помощь.

Форум

Справочник

Discord чат

Курсы javascript