Hello There,

Basically I want to print table from javascript.
I have a multidimenational array
global_arrayLength is lenght of that array
In form I have defined an table with below code

<div class='box1' id='show_this' name='show_this'>
    <div id='information-table'><table id='myTable'><tr bgcolor=#ff9966 id='0'>
            <td>Skill</td>
            <td>Skill Type</td>
            <td>Total Experience Year</td>
            <td>Total Experience months</td>
            <td>Last Used In</td>
            <td>Description</td>
            <td>Modify</td>
        </tr></div></table>
</div>

and in that table i want to push my array values from javascript as below:

for (var index=0;index < global_arrayLength;index++)
    {
        $("#myTable tr:last").after('<tr>');
        for(inner_index=skill_array[index].length-1;inner_index >=0;inner_index--)
        {           
            $("#myTable tr:last").after('<td>'+skill_array[index][inner_index]+'</td>');
        }$("#myTable td:last").after('<td><a onClick=edit_skill('+tr_id+');>'+EDIT+'</td>');

        $("#myTable td:last").after('</tr>');
    }

Here everything goes fine but the <tr>
:(

in firebug it shows code as below:

<tr id="0" bgcolor="#ff9966">
<td>Skill</td>
<td>Skill‌·Type</td>
<td>Total‌·Experience‌·Year</td>
<td>Total‌·Experience‌·months</td>
<td>Last‌·Used‌·In</td>
<td>Description</td>
<td>Modify</td>
</tr>
<tr></tr>  <!-- HERE IT SHOULD BE ONLY <tr>  -->
<td>DataBase</td>
<td>C++</td>
<td>0</td>
<td>1</td>
<td>May‌·2014</td>
<td></td>
<td>
<a onclick="edit_skill(1);">Edit‌·This‌·Skill</a>
</td>
<!-- AND HERE THERE SHOULD BE </tr>   -->

How can I do this with my script code i have pasted above?

I want output table as:

Skill Skill Type Total Experience Year  Total Experience months Last Used In  Description    Modify
Lan       C++           0                       1                 May 2014      acsasc    Edit This skil
Lan2      C             4                       6                 May 2012      test2     Edit This skil

Recommended Answers

All 2 Replies

If you tell jQuery to element.after('<tr>');, the <tr> part is interpreted as "<tr></tr>" (as a whole tag). Therefore you should use another way to create the table you want. For example (with example data):

var table = $('table#table_id');
var tr = $('<tr>');
var td;

// Create a <td> tag, fill it with text and prepend it to the <tr>.
td = $('<td>');
td.html = 'text';
td.prependTo(tr);

// Create another <td> tag, fill it with text and prepend it to the <tr>.
td = $('<td>');
td.html('text2');
td.prependTo(tr);

// Append the <tr> to the table.
tr.appendTo(table);

Thanks
solved

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.