Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Доступ к ячейке таблицы по кнопке. (https://javascript.ru/forum/misc/76359-dostup-k-yachejjke-tablicy-po-knopke.html)

savsoft 03.01.2019 22:38

Доступ к ячейке таблицы по кнопке.
 
Сильно не пинайте, я делаю первые шаги в javascript.

На php я формирую таблицу с несколькими полями. Одно из полей необходимо менять не перезагружая страницу. Если просто отдельное значение, то я могу это сделать через ajax-запрос. А вот в случае с таблицей не знаю как подступиться. На php я даю имя поля-массив с индексом уникальный код, а как быть в случае с javascript? Использовать массив или давать полю id="idN", где N уникальный код, а кнопке давать id="bidN"? Если так, то как определить нажатую кнопку и соответствующее ей поле?

Спасибо!

Rise 03.01.2019 23:51

Надо смотреть разметку таблицы, что где находится, где кнопки и их значения, если они в одной строке, то можно и без идентификатора обойтись, только индексом ячейки.

savsoft 04.01.2019 00:40

Цитата:

Сообщение от Rise (Сообщение 501293)
Надо смотреть разметку таблицы, что где находится, где кнопки и их значения, если они в одной строке, то можно и без идентификатора обойтись, только индексом ячейки.

Таблицу я сам формирую на php, но в зависимости от условий, заданных пользователем, сортировка и содержимое разные. В каждой строке есть колонка с уникальным кодом, несколько колонок с инфой, колонка с полем textarea и рядом колонка с кнопкой "Сохранить".

Вопрос как мне вывести колонку с полем textarea и кнопку, чтобы легко и просто идентифицировать, какая кнопка была нажата, а точнее прочитать содержимое поля textarea и уникальный код строки?

Rise 04.01.2019 01:33

$('td button').on('click', function (e) {
    var $button = $(this),
        buttonId = $button.attr('id');
    var $tr = $button.closest('tr'),
        trId = $tr.attr('id');
    var $textarea = $tr.find('textarea'),
        textareaValue = $textarea.val();
});

savsoft 04.01.2019 02:38

Цитата:

Сообщение от Rise (Сообщение 501295)
$('td button').on('click', function (e) {
    var $button = $(this),
        buttonId = $button.attr('id');
    var $tr = $button.closest('tr'),
        trId = $tr.attr('id');
    var $textarea = $tr.find('textarea'),
        textareaValue = $textarea.val();
});

А как должна выглядеть строка таблицы?

У меня сейчас строка для записи с уникальным кодом 16 выглядит так

Код:

<tr id="16">
<td>Awesome</td>
<td>S</td>
<td>31-01-2019</td>
<td><a class="btn btn-primary" href="ht.php?id=107&type=1">HT</a></td>
<td><textarea id="t16" rows="3" cols="64"></textarea></td>
<td><button id="b16"><img src="images/save.png"></button></td>
</tr>


Rise 04.01.2019 02:49

Идеально, мой уровень Ванги стал выше)

savsoft 04.01.2019 11:38

В конце концов сделал так и частично заработало

<script>
		$(document).ready(function(){

			// code to read selected table row cell data (values).
			$("#myTable").on('click','.btnSelect',function(){
				 // get the current row
				 var currentRow=$(this).closest("tr"); 
				 
				 //var col1=currentRow.find("td:eq(0)").text(); // get current row 1st TD value
				 var colT=currentRow.find("td:eq(7)").text(); // get current row 3rd TD
				 alert(colT);
			});
		});	
</script>


Этот скрипт выдает значение, которое было при формировании таблицы, а мне нужно введенное или измененное значение. Подскажите, куда копать?

Rise 04.01.2019 13:35

Какое видите значение в восьмой ячейке такое и получаете, других значений там нет.

savsoft 04.01.2019 14:28

Цитата:

Сообщение от Rise (Сообщение 501306)
Какое видите значение в восьмой ячейке такое и получаете, других значений там нет.

Разобрался, если я использую .text(), то вижу значение на момент создания таблицы, или пустое или значение, а чтобы увидеть новое введенное или измененное значение нужен .val().

А можно как-то прочитать id, например 5 ячейки текущей строки?

рони 04.01.2019 15:48

Цитата:

Сообщение от savsoft
А можно как-то прочитать id, например 5 ячейки текущей строки?

:blink:
а подумать?
currentRow.find("td:eq(4)").attr('id');


Часовой пояс GMT +3, время: 19:45.