Datalist Creator

serkan sendur 0 98 Views

Creates Asp.Net-like Datalist

// JScript File
function DataLister()
{
    // number of columns on the data list
    this.mRepeatColumns;
    // data list
    this.mTable;
    this.InitializeComponents = function()
    {
        this.mTable = document.createElement("table");
        this.InsertRow();
        
    }
    this.InsertRow = function()
    {
        var nRow = this.mTable.insertRow();
        for(var i=0; i< this.mRepeatColumns; i++)
        {
            nRow.insertCell();
        }
    }
    this.AddData = function(data)
    {
        for(var i=0; i< this.mRepeatColumns;i++)
        {
            if(this.mTable.rows[this.mTable.rows.length - 1].cells[i].childNodes.length == 0)
            {
             this.mTable.rows[this.mTable.rows.length - 1].cells[i].innerHTML = data;
             return;
            }
        
        }
        this.InsertRow();
        this.mTable.rows[this.mTable.rows.length - 1].cells[0].innerHTML = data;
        
    }
    this.GetDataList = function()
    {
        return this.mTable;
    }

}

Example usage :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <script type="text/javascript" src="datalister.js"></script>
</head>
<body>
<script type="text/javascript">

var den = new DataLister();
den.mRepeatColumns = 2;
den.InitializeComponents();
den.mTable.border ="1";
den.mTable.borderColor ="green";
den.AddData("abc");
den.AddData("bcd");
document.write(den.GetDataList().outerHTML);
</script>
</body>
</html>
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.

Edit Preview