How insert an input field in a table cell?

Question

Sorry for the noob question: I want to create a table with input fields where the can add new ones, if they are needed. But I can'T figure out how add another input field inside a cell where another input field already exists.

My code is:

var par=obj.parentNode;
while(par.nodeName.toLowerCase()!='tr')
{ par=par.parentNode; }
// this gives me the index of the row.. works fine.

cell1=document.getElementById('avz_tabelle').rows[par.rowIndex].cells;
// this puts the content of the cells into the array "cell1"

var feld = cell1[1].createElement("input"); 
feld.setAttribute("name","avz_keywords" + avz_array + "[]"); 
feld.setAttribute("onblur","");
feld.setAttribute("type","text"); 
feld.setAttribute("size","30"); 
// Now I create a input element
// And now comes the problem:

cell1[1].appendChild(feld); // --> doesn't work

Has anyone a suggestion for me? I got the idea to work without a table, theoratically that would work with my way. But that wouldn't be satisfying :/

Answer 1

If you look in a debugging console, you should see something like

TypeError: Object #<HTMLDivElement> has no method 'createElement'

Instead of creating the element from cell1[1], use document.createElement()

 var feld = document.createElement("input");