Advanced Search

Return to Snippet

Revision: 63053
at April 4, 2013 07:15 by COBOLdinosaur
Initial Code 
function buildTable()
{  
    tabobj = document.createElement("table");
    tabobj.width="80%";
    tabobj.style.backgroundColor = "khaki";
    tabobj.style="margin:auto";
    tabobj.style="border-radius:10px";
    thead = document.createElement("thead");
    tabobj.appendChild(thead);
    row = document.createElement("tr");
     thead.appendChild(row);
    for (i=0; i< 4; i++)
    {
        tHdg = document.createElement("th");
        HdgName = 'Heading' + (i+1);
        tHdg.innerHTML=HdgName;
        row.appendChild(tHdg);
    }
    tbody=document.createElement("tbody");
    tabobj.appendChild(tbody);
    for (i = 0; i < 5; i++) 
    {
        row = document.createElement("tr");
        row.setAttribute("id", "tr" + i);
        for (j = 0; j < 4; j++) 
        {
            td = document.createElement("td");
            td.className='cell';
            tContent = "row" +i + " cell" +j;
            td.innerHTML=tContent;
             row.appendChild(td);
        }
        tbody.appendChild(row);
    }
    main=document.getElementById('container');
    main.appendChild(tabobj);
}
Initial URL 
http://coboldinosaur.com/pages/Dynamically_Generated_Tables.html
Initial Description 
The use of dynamic data acquisition on modern web sites and in a lot of intranet applications, sometimes means we have to build structures dynamically as data comes in from a feed or AJAX operations. The problem is not with the data, but rather that it is unstructured, or not appropriately tagged. The solution is to dynamically build the necessary structures to make the data presentable in a web page
Initial Title 
Dynamic Table Generator
Initial Tags 
javascript, DOM
Initial Language 
JavaScript