С помощью скрипта можно добавлять строки в таблицу. После добавления строк необходимо удалить некоторые из них.
Листинг
<html>
<table id="tab1" class="sortable">
<thead>
<tr>
<th>Name</th>
<th>Value</th>
<th>Price</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<form action="" id="add_persons" method="post" onsubmit="addRow();return false;">
<fieldset>
<legend>Добавить товар</legend>
<ul>
<li>
<label for="name">Название товара</label>
<input type="text" name="name" id="name" value="" size="22" tabindex="1" />
</li>
<li>
<label for="value_my">Количество</label>
<input type="text" name="value_my" id="value_my" value="" size="27" tabindex="2" />
</li>
<li>
<label for="price">Стоимость</label>
<input type="text" name="price" id="price" value="" size="28" tabindex="3" />
</li>
<li>
<label for="subm">Действия</label>
<input type="submit" name="subm" class="submit" value="Добавить" tabindex="4" />
<input type="reset" name="subm" class="submit" value="Очистить форму" tabindex="4" />
</li>
</ul>
</fieldset>
</form>
<script>
var d = document;
var name;
var value_my;
var price;
function addRow()
{
// Считываем значения с формы
name = d.getElementById('name').value;
value_my = d.getElementById('value_my').value;
price = d.getElementById('price').value;
// Находим нужную таблицу
var tbody = d.getElementById('tab1').getElementsByTagName('TBO DY')[0];
// Создаем строку таблицы и добавляем ее
var row = d.createElement("TR");
tbody.appendChild(row);
// Создаем ячейки в вышесозданной строке
// и добавляем тх
var td1 = d.createElement("TD");
var td2 = d.createElement("TD");
var td3 = d.createElement("TD");
row.appendChild(td1);
row.appendChild(td2);
row.appendChild(td3);
// Наполняем ячейки
td1.innerHTML = name;
td2.innerHTML = value_my;
td3.innerHTML = price;
}
</script>
</head>
</body>
</html>
Желательно добавить форму и кнопку удаления. В форму вводится либо номер по порядку, либо name. Подскажите пожалуйста как можно это осуществить. Я тут нарыл кой-че, может это как нибудь сюда приплести.
Удалить строку № <input type="text" id="rowToRem"><input type="button" value="-" onClick="rem_line(document.getElementById('rowToRe m').value)">
только сам не могу разобраться