Нужно удалить строку в таблице.
С помощью скрипта можно добавлять строки в таблицу. После добавления строк необходимо удалить некоторые из них.
Листинг <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)"> только сам не могу разобраться |
Цитата:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type='text/css'>
</style>
<script type="text/javascript">
function Delete() {
var o=document.getElementById('tbl')
var n=+document.getElementById('n_row').value
if (n<1) {
alert('Не верно указан номер строки...')
return false
}
if (o.rows.length<n) {
alert('В таблице нет столько строк...')
return false
}
o.rows[n-1].removeNode(true)
}
</script>
</head>
<body>
<table id='tbl'>
<tr>
<td>line 1</td>
</tr>
<tr>
<td>line 2</td>
</tr>
<tr>
<td>line 3</td>
</tr>
</table>
<input type='text' id='n_row' />
<input type='button' value='Delete' onclick='Delete()' />
</body>
</html>
|
Цитата:
|
| Часовой пояс GMT +3, время: 19:10. |