Можно ли редактировать данные, найденные в таблицах HTML?

Question

Я не смог это узнать, но есть ли там рекомендованная библиотека/плагин JavaScript, позволяющая пользователю редактировать данные в таблице, как и любой вход? Или я должен просто создать таблицу с текстовыми вводами в таблицах <td />?

Answer 1

Используй сказочный DataTables JQuery плагин в сочетании с его редактируемым аддоном - См демо здесь: http://jquery-datatables-editable.googlecode.com/svn/trunk/index.html

DataTables - http://datatables.net/ аддон, который добавляет редактируемость к нему - http://code.google.com/p/jquery-datatables-editable/

Answer 2

Эта функция будет тем, что вы ищете? http://itlivewire.com/tuts/jquery-dynamically-change-table-rows.html

Или, если вы хотите, чтобы клиент, чтобы иметь возможность редактировать таблицу, этот плагин может быть более полезным: http://code.google.com/p/jquery-datatables-editable/

Answer 3

Если вы заинтересованы в Солу Тион без плагинов, просто цель клетки,

Если вы знаете идентификатор таблицы:

document.getElementById("**tableID**") 
    .getElementsByTagName("tr")[Row Number] 
    .getElementsByTagName("td")[Cell Number]; 

В противном случае вам нужно выбрать таблицу из индекса

document.getElementsByTagName("table")[Table Number] 
    .getElementsByTagName("tr")[Row Number] 
    .getElementsByTagName("td")[Cell Number]; 

Например если бы был стол с 2 рядами и 2 колонками, и я хотел, чтобы у всех их было число, которое я бы просто сделал:

var tableElm = document.getElementById("**tableID**") //table element 
    .getElementsByTagName("tr")[0] //row element 
    .getElementsByTagName("td"); //individual cells 

the table and row selection is now cached in tableElm 
tableElm[0].innerHTML = "1"; 
tableElm[1].innerHTML = "2"; 
tableElm[2].innerHTML = "3"; 
tableElm[3].innerHTML = "4"; 

вам даже не нужно «.getElementsByTagName (« tr ») [0]», если у вас нет причин запрашивать сами строки. Если вы избавитесь от него, CELL NUMBER будет включать каждую ячейку таблицы независимо от строки.