Форум PHP программистов > Получить строку таблыцы JavaScript

[ Поиск ] - [ Пользователи ] - [ Календарь ]

Полная Версия: Получить строку таблыцы JavaScript - DOM

BESTWIZARD

29.12.2011 - 21:37

Данные: есть простоая html страница с JavaScript функциями и таблицей table1. Таблица table1 содержит 10 строк и 5 колонок.

Вопрос: как получить все значения только любой определённой строки целиком ???

Расширение вопроса: в колонке 5 в таблице установлены кнопки - по одной на каждую строку "перенести" - как осуществить при нажатии на кнопку перенос одной текущей строки в которой нажимается данная кнопка в другую таблицу, рядом нарисованную или вообще в любую другую.

Весь нет обрыл - нет работающих ни примеров ни вообще чего-то похожего.

Заранее, большое спасибо за ответ.

Спустя 8 минут, 8 секунд (29.12.2011 - 20:46) bodja написал(а):

onClick="document.getElementById('tab2_td3').innerHTML=document.getElementById('tab1 _td5').innerHTML;"

Спустя 19 минут, 18 секунд (29.12.2011 - 21:05) BESTWIZARD написал(а):

Цитата (bodja @ 29.12.2011 - 17:46)

onClick="document.getElementById('tab2_td3').innerHTML=document.getElementById('tab1 _td5').innerHTML;"

Это всё конечно замечательно, а поподробнее объяснить можно ?

Точнее не ясно:

1) где указывается номер копируемой строки и ли хотя-бы может параметра self нету, указывающего на копируемую строку row

2) как указывается строка куда копируются данные ? Номер row то где ?

onClick="document.getElementById('tab2_td3').innerHTML=document.getElementById('tab 1 _td5').innerHTML;"

Понял пока так:

onClick= ----- событие на нажатие

document.getElementById --------- получить данные элемента, но элемент что это ? Надо-же как-то конкретизировать получаемый row таблицы - там 5 колонок и все 5 надо скопировать в другую таблицу.

Может как-то так:

document.getElementById('ff1').innerHTML = document.getElementById('f1').value;

или:

document.getElementsByTagName("47723")[0]

или:

var table = document.getElementById("ztbl1");
var allRows = table.getElementsByTagName("tr");
tr1 = allRows[1];
tr1.parentNode.removeChild(tr1);

Запутался, как это ? Где ошибка ?

Спустя 4 минуты, 34 секунды (29.12.2011 - 21:09) bodja написал(а):

Вам нужно просто вимательно почитать про функции getElementById и innerHTML ,ничего сложного здесь нет,поэтому и примеров не нашли.

<table>
....
<tr>
<td id="tab1_td5">Вася</td>
</tr>
.....
</table>

<table>
....
<tr>
<td id="tab2_td3">Петя</td>
</tr>
.....
</table>

Спустя 5 минут, 48 секунд (29.12.2011 - 21:15) BESTWIZARD написал(а):

Немного проясняется, примного благодарен.

А можно в качестве определителя конкретного row использовать не идентификатор целого td как здесь: <td id="tab1_td5">Вася</td>

А использовать скажем текст в одной из колонок строки, скажем в строке во второй колонке есть: <span id="41916">0</span> и исполльзуя этот id скопировать эту всю строку в новую таблицу ?

Спустя 29 секунд (29.12.2011 - 21:16) TMake написал(а):

bodja это ведь хороший способ если нужна одна ячейка - ты лучше покажи как получить доступ к таблицы и возможен доступ по всем дочерним тегам...

Спустя 4 минуты, 1 секунда (29.12.2011 - 21:20) BESTWIZARD написал(а):

Может как-то использовать такое:

<table>
<tr onClick='alert(this.rowIndex)'>
<td>dfgdfg</td>
<td>dfgdfg</td>
</tr>

Спустя 1 минута, 12 секунд (29.12.2011 - 21:21) bodja написал(а):

Все ,что находится между тегами с одним индентификатором ,можно переместить между тегами с другим идентом.
Если у тега не будет ид ,через getElementById указатель на него вы не получите.
Можно еще использоватть переборы дерева DOM ,но это уже отдельный гемор.
Я вам показал наиболее простой и короткий путь.

Спустя 2 минуты, 26 секунд (29.12.2011 - 21:23) bodja написал(а):

Цитата

Может как-то использовать такое:

Неясно ,вы хотите использовать ячейку в качестве кнопки?

Спустя 2 минуты, 44 секунды (29.12.2011 - 21:26) BESTWIZARD написал(а):

По-другому - в ячейке кнопка.

По названию ячейки сразу определить всю строку или зная где находится кнопка, в какой строке - сразу скопировать эту строку в другую таблицу вот и всё.

Спустя 2 минуты, 27 секунд (29.12.2011 - 21:29) BESTWIZARD написал(а):

Та не, ну как-тож точно можно.

Зачем перебор ?

Ведь если у нас кнопка в определённой ячейке, то можно использовать кнопу, чтобы скопировать содержимое ячейки в которой эта самая кнопка ?

Если пожно, то можно скопировать и близлежащие колонки в строке по принципу - копирование ячейки сроки колонка - 1, колонка + 1. Или это невозможно без перебора ?

Спустя 2 часа, 11 минут, 17 секунд (29.12.2011 - 23:40) BESTWIZARD написал(а):

Похоже всё идей нет ?

Спустя 19 минут, 59 секунд (30.12.2011 - 00:00) phpdreamer написал(а):

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript" charset="utf-8"></script>

<table id="table1" border="1">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td><button class="p">Perenesti</button></td>
</tr>
<tr>
<td>2</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td><button class="p">Perenesti</button></td>
</tr>
<tr>
<td>3</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td><button class="p">Perenesti</button></td>
</tr>
</table>

<br />
<br />

<table id="table2" border="1">
<tr>
<td>111</td>
<td>112</td>
<td>113</td>
<td>114</td>
<td></td>
</tr>
</table>


<script type="text/javascript">
$(document).ready(function(){
    $('.p').click(function(){
	$(this).hide();
	var $row = $(this).parent().parent();		
        $("#table2").html($("#table2").html() + $row.html());
	$row.hide();
    });
});
</script>

Спустя 21 минута, 48 секунд (30.12.2011 - 00:22) bodja написал(а):

1 Что мешает Вам поставить иденты в нужные ячейки?
2 Раставить иденты сложнее чем городить типа
document.getElementById('tab').getElementsByTagName('tr')[1].innerHTML + this.rowIndex + парсер ,так как innerText не работает на фаерфоксе ,или будете еще выяснять тип браузера ?

Быстрый ответ:

Здесь расположена полная версия этой страницы.