Присоединение ввода к форме И отображаемому элементу

Question

У меня есть форма, элементы которой аккуратно отформатированы в таблице, вложенной в теги формы, и я хочу добавить еще одну строку в эту таблицу с новым вводом.Как я могу добавить этот новый ввод как к элементу формы (чтобы он присутствовал в document.forms.formName и отправлялся вместе с формой), так и к ячейке новой строки (чтобы она отображалась внутри строки)?

Вызов метода appendChild для ячейки и элемента формы просто добавляет его к последнему вызванному, а не присваивает ему двойное членство.Есть ли какое-либо дополнение, которое я могу вызвать из формы, которое не влияет на способ визуализации элемента?

Редактировать: Woops, если форма вложена в таблицу, а не наоборот.Это не работает в Firefox 3.6, но работает в Internet Explorer 8.

Answer 1

Если вы просто хотите получить копию существующей строки таблицы, просто клонируйте всю строку и добавьте ее в таблицу. Если таблица находится в форме, входные данные будут автоматически добавлены в форму.

Тривиальный пример:

<form ...>
  <table> 
    <tr><td><input name="foo">
  </table>
</form>

<button onclick="
  var table = document.getElementsByTagName('table')[0];
  var tBody = table.tBodies[0]
  var newRow = tBody.rows[0].cloneNode(true);
  tBody.appendChild(newRow);
">Add a row</button>

Обратите внимание, что вам, вероятно, потребуется обновить имя и значение ввода и выполнить некоторые другие действия, приведенные выше просто показывают стратегию.