Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.12.2010, 02:16
Новичок на форуме
Отправить личное сообщение для Раиль Посмотреть профиль Найти все сообщения от Раиль
 
Регистрация: 16.12.2010
Сообщений: 2

Нужно удалить строку в таблице.
С помощью скрипта можно добавлять строки в таблицу. После добавления строк необходимо удалить некоторые из них.

Листинг
<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. Подскажите пожалуйста как можно это осуществить. Я тут нарыл кой-че, может это как нибудь сюда приплести.

Удалить строку №&nbsp;<input type="text" id="rowToRem"><input type="button" value="-" onClick="rem_line(document.getElementById('rowToRe m').value)">

только сам не могу разобраться
Ответить с цитированием
  #2 (permalink)  
Старый 16.12.2010, 14:28
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 12,919

Сообщение от Раиль
Желательно добавить форму и кнопку удаления
Как вариант...

<!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>
Ответить с цитированием
  #3 (permalink)  
Старый 16.12.2010, 14:58
Профессор
Отправить личное сообщение для Sweet Посмотреть профиль Найти все сообщения от Sweet
 
Регистрация: 16.03.2010
Сообщений: 1,618

Сообщение от ksa
Как вариант...
Не лучший вариант из-за .removeNode.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Изменение цвета ячейки в таблице, при наведении на строку другой таблицы Psychosonic Общие вопросы Javascript 12 24.11.2010 15:44
Не могу выбрать и удалить клонируемые элементы AlexPrm jQuery 6 30.05.2010 14:58
Сортировка числовых данных в таблице Vladsss Общие вопросы Javascript 15 01.09.2009 16:02
удалить строку из таблицы olgatcpip Общие вопросы Javascript 9 05.05.2009 12:56
Как частично удалить текстовую строку из набора? Nubi jQuery 2 27.12.2008 21:11