Use jQuery insertAfter in existing function that appends table

Question

Here is what I have so far: http://jsfiddle.net/JEAkX/1/

I am trying to get the appended cells to come after the last tr. Furthermore, I am attempting to change the appendTable(id) function so that the output cells have their content inside an <input> field like the original cells.

For the <input> addition I have tried:

Adding the input field code <input type='text' size='1' value='subset[i++]' /> at various point with no luck I also tried it in another location but changed the value to value='c'.

For append after last tr I have tried:

Using jQuery and .insertAfter('#alphabetTable tbody>tr:last') I added it to various parts of the cell.appendChild(document.createTextNode(subset[i++])); line but had no luck..probably the wrong placement?

I feel like I am sort of on the right track but lack the Javascript knowledge to know exactly where to insert the code and if surrounding code needs change.

Satyajit · Accepted Answer · 2011-03-09 22:23:42Z

0

It'll be easier with JQuery but here's a hint:

function appendTable(id)
{
    var tbody = document.getElementById(id).getElementsByTagName("tbody")[0];
    var i = 0;
    var html = '<tr>';
    for(i=0;i<4;i++){
        html += '<td><input type="text" size="1"/></td>';
    }
    html += '</tr>';

    tbody.innerHTML += html;
}

answered Mar 9, 2011 at 22:23

Satyajit

3,8591 gold badge22 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Fahad Al Mohammadi · Accepted Answer · 2011-03-10 00:55:37Z

0

Jquery:

var $tbody = $('#mytableid tbody:eq(0)');
var $tdLen = $('#mytableid tbody:eq(0) tr:eq(0) td').length; // cell length in row
$("<tr>").appendTo($tbody);
//append cells to row with input text
for (var i=0;i<$tdLen;i++){
    var inp = $("<input>").attr("type","text").attr("name","text"+i).val(i);
    var tdTemo = $("<td>");
    inp.appendTo(tdTemo);
    tdTemo.appendTo("tr:last");
}

this script will append row to table and add 4cells contain input type text :)

answered Mar 10, 2011 at 0:55

Fahad Al Mohammadi

112 bronze badges

1 Comment

tehaaron Over a year ago

Omg, it told me about this response right after I posted:stackoverflow.com/questions/5254283/… do you think you could look at that one and tell me what you think?..I would prefer to delete this question as I was asking multiple questions in a poor way haha.

Collectives™ on Stack Overflow

Use jQuery insertAfter in existing function that appends table

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related