Table Pager

// JScript File

  
   // Example usage of this class :
//    var myPager = new TablePager();
//    myPager.mDestElem = document.getElementById("vs");
//    myPager.mDestPageNavigator = document.getElementById("vs2");
//    myPager.mTableData = document.getElementById("mine").outerHTML;
//    myPager.InitializeComponents();
//    myPager.CreatePage(0);
function TablePager()
{
    // temporary container to parse Table string to dom
    this.mContainer;
    // html table string
    this.mTableData;
    // dom table
    this.mTable;
    // number of rows in the table
    this.mTableRowsCount;
    // where to insert paged table  
    this.mDestElem;
    // number of rows per page
    this.mPageSize = 7;
    // number of pages
    this.mPageCount;
    // index of page
    this.mPageIndex;
    // where to insert navigation control
    this.mDestPageNavigator;
    // remainder of rows
    this.mRemainder;
    // the paged table
    this.mTempTable;
    this.InitializeComponents = function()
    {
        this.mContainer = document.createElement("div");
        this.mContainer.innerHTML = this.mTableData;
        this.mTable = this.mContainer.firstChild;
        this.mTableRowsCount = this.mTable.rows.length;
        this.mRemainder = this.mTableRowsCount % this.mPageSize;
        this.mPageCount = (this.mTableRowsCount - this.mRemainder) / this.mPageSize + 1;
        this.CreateNavigator();
    }
    this.CreateNavigator = function()
    {
       var selectBox = "<select onchange='myPager.CreatePage(this.value)'>";
       for (var a = 0; a < this.mPageCount; a++) 
       {
            selectBox += "<option value=" + a + ">" + a + "</option>";
       }
       selectBox += "</select>"; 
       this.mDestPageNavigator.innerHTML = selectBox;
    }
    this.CreatePage = function(PageIndex)
    {
        this.mPageIndex = PageIndex;
        this.mTempTable = this.mTable.cloneNode(false);
        if(this.mTableRowsCount < this.mPageSize)
            throw("Page Size can not be bigger than rows count");
        if(this.mPageIndex >= this.mPageCount)
            throw("Page Index can not be bigger or equal to page count");
        if(this.mPageIndex == (this.mPageCount -1))
        {
            for(var i = (this.mPageIndex * this.mPageSize); i < ((this.mPageIndex * this.mPageSize) + this.mRemainder); i++)
            {
                var myRow = this.mTable.rows[i].cloneNode(true);
                this.mTempTable.appendChild(myRow);
            }
            this.mDestElem.innerHTML = this.mTempTable.outerHTML;
            return;
        }
        
        for (var i = (this.mPageIndex * this.mPageSize); i < ((parseInt(this.mPageIndex) +1) * this.mPageSize); i++) 
        {
            var myRow = this.mTable.rows[i].cloneNode(true);
            this.mTempTable.appendChild(myRow);
        }
         this.mDestElem.innerHTML = this.mTempTable.outerHTML;
       
    }
    
}