// JScript File
//addNamespace("xWebControls");
g_CurrentSortColumnID = "";

//------------------ Grid Styles -----------------------
function xGridStyle() {
  this.RowClass = 'Row';
  this.AltRowClass = 'AltRow';
  this.SelRowClass = 'SelRow';  
  this.HeadingClass = 'Heading';
  this.NoDataClass = 'NoData';
  this.SelectionMode = 'One'; //allowed values are 'Cell', 'None','One' and 'Multiple'
  this.AutoGenerateColumns = true;
  this.ShowHeader = true;
  this.AllowPaging = true;
  this.RowsPerPage = 20;
  this.ShowPager = true;
  this.NoDataMessage = "No data to display.";
 
  //This is the number of pixels to adjust the with of the headers by to 
  //make them align with the columns. Usualy the headers left and right border width.
  this.headerAdjust = -2; 
  
  this.ColumnStyles = new Array();
}


function xGridPagerStyle() {
  this.ClassName = 'Pager';
  this.ShowNextPrev = true;
  this.ShowGoToPage = true;  
  this.ShowPageNumber   = true;
  this.LabelGoToPage = 'Go To Page'; 
  this.LabelFirst = 'First';
  this.LabelPrevious = 'Previous';
  this.LabelNext = 'Next';
  this.LabelLast = 'Last';
  this.ImgSrcFirst = '';
  this.ImgSrcPrevious = '';
  this.ImgSrcNext = '';
  this.ImgSrcLast = '';

}

function xGridColumnStyle() {
    this.cellClass = "Cell";
   
    //Data Column that provides the data for the column, if not found in the 
    //dataset and AutoGenerateColumns is false then the text will be repeated in all rows. 
    this.MappingName = "DATA_FIELD"; 
    
    this.HeaderText = "Description";
    this.NullText = ""; //Text to display when field value is null
    
    //Cell type HREF for link, IMG for image, null for text
    //(IMG will also support links defined by HREFColumnName)
    this.Control = null;
    
    this.IMGSrcColumnName = null; //DataColumn that provides the url of the image, or a static image url.
    this.HREFColumnName = null; //Data column that provides the link url.
    this.Width = 0;
    this.Format = null; //# for int, #.# for float, standard date format string for dates, null for no formatting.
    this.WrapText = false; 
    this.Sortable = false;
    this.SortFunction = null; //Allows you to override the default sort function for special cases.
    this.RenderAsHTML = true; //Contents will be rendered as HTML rather then text.
    this.TextAlign = "left"; 
    this.IsEditable = false;
}
//-----------------------------------------


function xGridView(TableID) //Main Class
{
    this.classID = TableID;
    this.GridStyle = new xGridStyle();
    this.origonalWidth = 0;
    this.PageIndex = 0;
     
    //DataBind() Function
    this.DataBind = function(DataTbl, resetPage)
    {
        var cells = new Array();
        var tbl = document.getElementById(TableID + "_TABLE");
        this.Table = tbl;
        this.DataTable = DataTbl;
        tbl.GridView = this;
        
        while (tbl.rows.length > 0) {
            tbl.deleteRow(0);
        }
        if (this.GridStyle == null){
            this.GridStyle = new xGridStyle();
        }
        if (this.PagerStyle == null){
            this.PagerStyle = new xGridPagerStyle();
        }
        
        if (resetPage) {
            this.PageIndex = 0;
        }
        
         var lastRow = tbl.rows.length;
         
         var headerTbl = document.getElementById(TableID + "_HEADER");
         
         if (headerTbl.rows.length > 0) {
            headerTbl.deleteRow(0); 
         }
         var row = headerTbl.insertRow(0);
         this.CreateHeader(DataTbl.Columns,this.GridStyle.ColumnStyles, this.GridStyle.HeadingClass, row,this.GridStyle.AutoGenerateColumns, this.GridStyle.ShowHeader, this.classID);
        
         
        if(this.GridStyle.RowsPerPage==null){
            this.GridStyle.RowsPerPage = 20;
        }
        this.TotalPages = 1;
       
        if(this.GridStyle.AllowPaging!=null && this.GridStyle.AllowPaging){
            if(DataTbl.Rows.length/this.GridStyle.RowsPerPage > Math.round(DataTbl.Rows.length/this.GridStyle.RowsPerPage)){
                this.TotalPages = Math.round(DataTbl.Rows.length/this.GridStyle.RowsPerPage) + 1;
            }
            else{
                this.TotalPages = Math.round(DataTbl.Rows.length/this.GridStyle.RowsPerPage);
            }
            
        } 
        
        if (DataTbl.Rows.length > 0) {
            for (var i=0;i< DataTbl.Rows.length; i++)
            {
                if(this.GridStyle.AllowPaging!=null && this.GridStyle.AllowPaging){
                    if((i>= this.PageIndex * this.GridStyle.RowsPerPage ) && ( i < ((this.PageIndex + 1)* this.GridStyle.RowsPerPage ))){
                        this.AddRow(DataTbl.Rows[i], i);
                    }
                }
                else{
                    this.AddRow(DataTbl.Rows[i], i);
                }
                
            }
       }
       else {
        //No Data
            var row = this.Table.insertRow(0);
            var cell = row.insertCell(0);
            cell.className = this.GridStyle.NoDataClass;
            cell.innerHTML = this.GridStyle.NoDataMessage;
       }
       this.ApplyPageStyle();
       this.SelectedCell = null;
       
       var gridWindow = document.getElementById(TableID + "_DIV");
       
       
        //Adjust the width of the grid...
        if (!this.GridStyle.AutoGenerateColumns) {
           var totalWidth = 0;
           for (var j=0;j< this.GridStyle.ColumnStyles.length; j++){
                totalWidth += this.GridStyle.ColumnStyles[j].Width;
           }
           if (totalWidth > gridWindow.offsetWidth) {
                tbl.style.width = totalWidth;
                tbl.width = totalWidth;
                headerTbl.style.width = totalWidth;
                headerTbl.width = totalWidth;
           }
        }
        else {
              tbl.style.width = gridWindow.offsetWidth
              tbl.width = gridWindow.offsetWidth;
              headerTbl.style.width = gridWindow.offsetWidth;
              headerTbl.width = gridWindow.offsetWidth;
        }
        
        
        //IF we are scroling we have to adjust the data table to make room for the scroll bar.
        
        if (tbl.offsetHeight > tbl.parentNode.offsetHeight && this.origonalWidth == 0) {
            this.origonalWidth = parseInt(tbl.parentNode.style.width);
            tbl.parentNode.style.width = parseInt(tbl.parentNode.style.width) + 19;
            tbl.parentNode.width = parseInt(tbl.parentNode.style.width) + 19;
        }
        else if (tbl.offsetHeight <= tbl.parentNode.offsetHeight && this.origonalWidth != 0) {
            tbl.parentNode.style.width = this.origonalWidth;
            tbl.parentNode.width = this.origonalWidth;
            this.origonalWidth = 0;
        }
        
       //Adjust Column header width to match data...
       var i;
       for (i = 0; i < tbl.rows[0].cells.length; i++)
       {
          headerTbl.rows[0].cells[i].width =  tbl.rows[0].cells[i].offsetWidth + this.GridStyle.headerAdjust;
       } 
       
    }
    
    //CreateHeader() function
    this.CreateHeader = function(Columns,ColumnStyles, HeadingClass, row,autoGen,showHdr, classID)
    {
        var cell;
        if (ColumnStyles==null){
            for (var j=0;j< Columns.length; j++){
                cell = row.insertCell(j);
                cell.innerText = Columns[j].Name;
                cell.className = HeadingClass;
            }
        }
        else if (autoGen){
            for (var j=0;j< Columns.length; j++){
               cell = row.insertCell(row.cells.length);
               cell.className = HeadingClass;
               cell.innerText = Columns[j].Name;
               for(var csIdx=0;csIdx< ColumnStyles.length;csIdx++){    
                    if(Columns[j].Name.toUpperCase()==ColumnStyles[csIdx].MappingName.toUpperCase() ) {
                        cell.className = HeadingClass;
                        cell.id = "col-" + csIdx; 
                          if(ColumnStyles[csIdx]!=null && ColumnStyles[csIdx].Width != null && ColumnStyles[csIdx].Width != 0) {
                                cell.width = ColumnStyles[csIdx].Width;
                          }      
                                              
                        if (ColumnStyles[csIdx].Sortable) {
                          cell.innerHTML = "<div style='width:100%' onclick='fSortByColumn(event,\"" + classID + "\")'>" + ColumnStyles[csIdx].HeaderText + "</div>";
                          cell.style.cursor = "pointer"; 
                         }
                         else {
                          cell.innerHTML = "<div style='width:100%'>" + ColumnStyles[csIdx].HeaderText + "</div>";
                       }   
                    }
                }
                
            }
        }
        else{
            for(var csIdx=0;csIdx< ColumnStyles.length;csIdx++){
                cell = row.insertCell(row.cells.length);
                cell.className = HeadingClass;
                cell.innerText = (ColumnStyles[csIdx].HeaderText != null?ColumnStyles[csIdx].HeaderText:ColumnStyles[csIdx].MappingName);
                cell.id = "col-" + csIdx;
                if(ColumnStyles[csIdx]!=null && ColumnStyles[csIdx].Width != null && ColumnStyles[csIdx].Width != 0) {
                      cell.width = ColumnStyles[csIdx].Width;
                } 
                if (ColumnStyles[csIdx].Sortable) {
                  cell.innerHTML = "<div style='width:100%' onclick='fSortByColumn(event,\"" + classID + "\")'>" + ColumnStyles[csIdx].HeaderText + "</div>";
                  cell.style.cursor = "pointer"; 
                 }
                 else {
                  cell.innerHTML = "<div style='width:100%'>" + ColumnStyles[csIdx].HeaderText + "</div>";
               }   
            }
        }
        if(showHdr){
            row.style.display ='';
        }
        else{
            row.style.display = 'none';
        }
            
    }/*--- End of Function CreateHeader() ---*/
    
    //AddRow() function
    this.AddRow = function(dtRow, rowId)
    {
        var cell; 
        var hrefVal;
        var imgSrcVal;
        var rIdx = this.Table.rows.length;
        var row = this.Table.insertRow(rIdx);
        row.IsSelected = false;
        row.DataRow = dtRow;
        row.rowId = rowId;
       
        if (row.rowIndex/2 == Math.round(row.rowIndex/2)){ 
            row.className= this.GridStyle.RowClass;
        }
        else{
            row.className= this.GridStyle.AltRowClass;
        }
         
        
        
        if(this.GridStyle.AutoGenerateColumns ){
            for (var j=0; j<this.DataTable.Columns.length; j++){
                this.AddCell(row,dtRow[this.DataTable.Columns[j].Name],null,null,this,this.GridStyle.ColumnStyles[j],this.DataTable.Columns[j].__type, this.DataTable.Columns[j].Name);
            }
        }
        else{
            var foundIt;
            for(var csIdx=0;csIdx<this.GridStyle.ColumnStyles.length; csIdx++){
                foundIt = false;
                for (var j=0; j<this.DataTable.Columns.length; j++){
                   
                    if(this.DataTable.Columns[j].Name.toUpperCase()== this.GridStyle.ColumnStyles[csIdx].MappingName.toUpperCase()){
                        foundIt = true;
                        if(this.GridStyle.ColumnStyles[csIdx].HREFColumnName!=null){
                            hrefVal = dtRow[this.GridStyle.ColumnStyles[csIdx].HREFColumnName];
                        }
                         
                        if(this.GridStyle.ColumnStyles[csIdx].IMGSrcColumnName!=null){
                            imgSrcVal = dtRow[this.GridStyle.ColumnStyles[csIdx].IMGSrcColumnName];
                            if (imgSrcVal == null) {
                                imgSrcVal = this.GridStyle.ColumnStyles[csIdx].IMGSrcColumnName;
                            }   
                        }
                       this.AddCell(row, dtRow[this.DataTable.Columns[j].Name],hrefVal, imgSrcVal, this,this.GridStyle.ColumnStyles[csIdx],this.DataTable.Columns[j].__type, this.DataTable.Columns[j].Name);
                       continue;
                    }
                } 
                if (!foundIt) {
                    if(this.GridStyle.ColumnStyles[csIdx].HREFColumnName!=null){
                        hrefVal = dtRow[this.GridStyle.ColumnStyles[csIdx].HREFColumnName];
                    }
                    if(this.GridStyle.ColumnStyles[csIdx].IMGSrcColumnName!=null){
                        imgSrcVal = dtRow[this.GridStyle.ColumnStyles[csIdx].IMGSrcColumnName];
                        if (imgSrcVal == null) {
                            imgSrcVal = this.GridStyle.ColumnStyles[csIdx].IMGSrcColumnName;
                        } 
                    }
                    this.AddCell(row, this.GridStyle.ColumnStyles[csIdx].MappingName ,hrefVal, imgSrcVal, this,this.GridStyle.ColumnStyles[csIdx],'string');
                }
                           
            }
        }     
    }/*--- End of Function AddRow() ---*/
    
    this.AddCell = function(row,cellValue,cellHREF,cellIMGSrc,GrdView,ColumnStyle,DataType, columnId){
        cell = row.insertCell(row.cells.length);
        cell.columnId = columnId;
        if(ColumnStyle!=null && ColumnStyle.Width != null && ColumnStyle.Width != 0) {
            cell.width = ColumnStyle.Width;
        }
        
        if (ColumnStyle!=null) {
            cell.isEditable = ColumnStyle.IsEditable;
        }
        
        
        var noBR; var cellItm;
        if(ColumnStyle!=null && ColumnStyle.WrapText != null){
            if(!ColumnStyle.WrapText){
               noBR  = document.createElement("nobr");
               cell.appendChild(noBR);
            }
        }
        else if(GrdView.GridStyle.WrapText != null){
            if(!GrdView.GridStyle.WrapText){
              noBR   = document.createElement("nobr");
              cell.appendChild(noBR);  
            }
        } 
        if(noBR==null){
            noBR = cell;
        }
        if (ColumnStyle != null) {
            cell.style.textAlign = ColumnStyle.TextAlign;
            if (ColumnStyle.cellClass != null) {
                cell.className = ColumnStyle.cellClass;
            }   
        }
       
        if (cellValue == null) {
            cellValue = ColumnStyle.NullText;
        }
        else if(cellValue!= '[object Object]'){ 
            if(ColumnStyle ==null){
               // noBR.innerText = cellValue;
            }
            else if(ColumnStyle.Format == null){
                //noBR.innerText = cellValue;
            }
            else {
                if(ColumnStyle.Format == "#"){
                    //noBR.innerText = parseInt(cellValue);
                    cellValue = parseInt(cellValue);
                }
                else if(ColumnStyle.Format == "#.#"){
                    cellValue = parseFloat(cellValue);
                }
                else if(DataType=="System.DateTime"){
                    cellValue = formatDate(cellValue,ColumnStyle.Format);
                } 
            }     
        }
        else{
                cellValue = " "
        }
        
        
        
        if(ColumnStyle !=null && ColumnStyle.Control != null && ColumnStyle.Control.toUpperCase() == "HREF"){
            cellItm = document.createElement("a");
            if (ColumnStyle.RenderAsHTML) {
                cellItm.innerHTML = cellValue;
            }
            else {
                cellItm.innerText = cellValue;
            }
            
            cellItm.href = cellHREF;
            cellItm.target = "_blank";
            noBR.appendChild(cellItm); 
        }
        else if(ColumnStyle !=null && ColumnStyle.Control != null && ColumnStyle.Control.toUpperCase() == "IMG"){
            if(cellHREF != null){
                cellItm = document.createElement("a");
                cellItm.href = cellHREF;
                noBR.appendChild(cellItm);
                noBR = cellItm;
            }
            cellItm = document.createElement("Img");
            cellItm.src = cellIMGSrc;
            cellItm.border = "0";
            noBR.appendChild(cellItm); 
            cellItm = document.createTextNode(cellValue);
            noBR.appendChild(cellItm);
            
        }
        else{
            if (ColumnStyle != null && ColumnStyle.RenderAsHTML) {
                 noBR.innerHTML = cellValue;
            }
            else {
                noBR.innerText = cellValue;
            }
        }
     try {
            cell.attachEvent('onselectstart', ReturnFalse);
            cell.attachEvent('onclick', SelectUnselectRow);
       }
        catch(e) {
           //cell.addEventListener('select', ReturnFalse, false)
           cell.addEventListener('click', SelectUnselectRow, true)
        }
    }
      
    //GetSelectedRows() function
    this.SelectedRows = function() {
  
         var tbl = document.getElementById(TableID);
         var selRows = new Array();
         for(var i=0; i<tbl.rows.length; i++)
         {
            if (tbl.rows[i].IsSelected)
            {
                selRows[selRows.length] = tbl.rows[i];
            }
         }
         return selRows;
    }
    
    // Select a single cell
    this.SelectCell = function(cell) {
        this.SelectedCell = cell;
        cell.className = this.GridStyle.SelRowClass;
    }
    
    //SelectRow() function
    this.SelectRow = function(row) {
       var cName = this.GridStyle.SelRowClass;
       row.IsSelected = true;
       row.className = cName;
    }
    
    //UnselectRow() function
    this.UnselectRow = function(row) {
       var cName;
       if(row.rowIndex/2 == Math.round(row.rowIndex/2))
        { cName = this.GridStyle.RowClass;}
       else
        { cName = this.GridStyle.AltRowClass;}
       row.IsSelected = false;
       row.className = cName;
    }
    
    //GotoPage() function
    this.GoToPage = function(pageNo) {
        if (pageNo > this.TotalPages) {
            pageNo = this.TotalPages;
        }
        else if (pageNo < 1) {
            pageNo = 1;
        }
        this.PageIndex = parseInt(pageNo) - 1;
        this.DataBind(this.DataTable)   
    }
    
    //ApplyPageStyle function
    this.ApplyPageStyle = function(){
        var  pTbl;
        try{
            pTbl = document.getElementById(this.Table.id.replace("_TABLE","_PAGER"));
        }catch(e){};
        if(pTbl!=null){
            if(this.GridStyle.ShowPager!=null && this.GridStyle.ShowPager){
                pTbl.style.display='';
            }
            else{
                pTbl.style.display='none';
            }
            //ClassName
            for(var i=0;i<pTbl.rows[0].cells.length;i++){
                if(this.PagerStyle.ClassName!=null && this.PagerStyle.ClassName.length>0){
                    pTbl.rows[0].cells[i].className = this.PagerStyle.ClassName;
                }
                else if(this.GridStyle.HeadingClass!=null && this.GridStyle.HeadingClass.length>0) {
                    pTbl.rows[0].cells[i].className = this.GridStyle.HeadingClass;
                }
            }
           
            //Page Numbers
            var cn = pTbl.rows[0].cells[0].childNodes[0];
            while (cn.tagName != 'SPAN') {
                cn = cn.nextSibling;
            }
            if(this.PagerStyle.ShowPageNumber!=null && this.PagerStyle.ShowPageNumber){
                cn.style.visibility = 'visible';
                cn.innerHTML="Page " + (this.PageIndex + 1) + " of " + this.TotalPages ;
            }
            else{
                cn.style.visibility = 'hidden';
                cn.innerHTML="";
            }
            
            //Go To Page
           var sp = document.getElementById(this.Table.id.replace("_TABLE","_GOTOPAGE"));
            while(sp.tagName!='SPAN')
            {
                sp = sp.parentNode;
            }
            if(this.PagerStyle.ShowGoToPage!=null && this.PagerStyle.ShowGoToPage){
                sp.style.visibility = 'visible';
                for(var i=0;i<sp.childNodes.length;i++){
                    if(sp.childNodes[i].tagName=='SPAN'){
                        
                        sp.childNodes[i].innerHTML = this.PagerStyle.LabelGoToPage;
                        break;
                    }
                }
            }
            else{
                sp.style.visibility = 'hidden';
            }
          
           //First
           var sVis;
           if(this.PagerStyle.ShowNextPrev!=null && this.PagerStyle.ShowNextPrev){
                sVis = 'visible';
           }
           else{
                sVis = 'hidden';
           }
           
           this.ShowHidePageButtons(pTbl.rows[0].cells[2],this.PagerStyle.LabelFirst,this.PagerStyle.ImgSrcFirst,sVis,'Left');
           this.ShowHidePageButtons(pTbl.rows[0].cells[3],this.PagerStyle.LabelPrevious,this.PagerStyle.ImgSrcPrevious,sVis,'Left');
           this.ShowHidePageButtons(pTbl.rows[0].cells[4],this.PagerStyle.LabelNext,this.PagerStyle.ImgSrcNext,sVis,'Right');
           this.ShowHidePageButtons(pTbl.rows[0].cells[5],this.PagerStyle.LabelLast,this.PagerStyle.ImgSrcLast,sVis,'Right');
        } 
    }
    
    //function
    this.ShowHidePageButtons = function(td,lbl,src,styleVis,ImgPos){
        var sp = td;
        var img;
        var txt;
        sp = sp.childNodes[0];
        while (sp.tagName != 'SPAN'){
            sp = sp.nextSibling;
        }
       
        sp.style.visibility = styleVis;
        var a = sp.childNodes[0];
        a.innerHTML=""; 
        
        if(src.length>0 && ImgPos=='Left'){
            img = document.createElement("IMG");
            img.src = src;
            img.border =0;
            a.appendChild(img); 
        }        
        txt = document.createTextNode(lbl);
        a.appendChild(txt);
        if(src.length>0 && ImgPos=='Right'){
            img = document.createElement("IMG");
            img.src = src;
            img.border =0;
            a.appendChild(img); 
        }          
    }  
    
    this.insertGrid = function (height, width) {
        var outStr = "<div id='" + this.classID + "_DIV' class='GridWindow' style='width: " + width + "'>" + "\n" +
                     "   <div style='border-right: gray 1px solid; border-left: gray 1px solid; border-top: gray 1px solid; border-bottom-style: none; overflow: hidden; table-layout: fixed; width: " + width + "'>" + "\n" +
                     "      <table id='" + this.classID + "_HEADER' cellspacing='0' cellpadding='0'>" + "\n" +
                     "       </table>" + "\n" +
                     "   </div>" + "\n" +
                     "   <div style='border: gray 1px solid; overflow-y: scroll; table-layout: fixed; height: " + height + "; width: " + width + "' onscroll='syncScroll(event);'>" + "\n" +
                     "      <table id='" + this.classID + "_TABLE' cellspacing='0' cellpadding='0'>" + "\n" +
                     "       </table>" + "\n" +
                     "   </div>" + "\n" +
                     "   <div style='border-right: gray 1px solid; border-left: gray 1px solid; border-bottom: gray 1px solid; border-top-style: none; overflow: hidden; table-layout: fixed; width: " + width + "'>" + "\n" +
                     "   <table id='" + this.classID + "_PAGER' style='display: none; width: " + width + "' cellspacing='0' cellpadding='0'>" + "\n" +
                     "       <tr>" + "\n" +
                     "           <td class='Pager' style='width: 50%'>" + "\n" +
                     "               <span style='visibility: hidden'>Page x of y </span>&nbsp;&nbsp;</td>" + "\n" +
                     "           <td class='Pager' style='width: 22%'>" + "\n" +
                     "               <span style='visibility: hidden'><span>Go to page</span><input style='width: 15px; height: 12px' type='text' id='" + this.classID + "_GOTOPAGE' />" + "\n" +
                     "                  <input style='height: 20px' type='button' value='Go' onclick='" + this.classID + ".GoToPage(document.getElementById(\"" + this.classID + "_GOTOPAGE\").value);' />&nbsp;&nbsp;" + "\n" +
                     "               </span>" + "\n" +
                     "           </td>" + "\n" +         
                     "           <td class='Pager' style='width: 7%'>" + "\n" +
                     "               <span style='visibility: hidden'><a href='' onclick='" + this.classID + ".GoToPage(1); return false;'>" + "\n" +
                     "                   <span>First</span></a>&nbsp;&nbsp; </span>" + "\n" +
                     "           </td>" + "\n" +
                     "           <td class='Pager' style='width: 7%'>" + "\n" +
                     "               <span style='visibility: hidden'><a href='' onclick='" + this.classID + ".GoToPage(" + this.classID + ".PageIndex); return false;'>" + "\n" +
                     "                   <span>Previous</span></a>&nbsp;&nbsp; </span>" + "\n" +
                     "           </td>" + "\n" +
                     "           <td class='Pager' style='width: 7%'>" + "\n" +
                     "               <span style='visibility: hidden'><a href='' onclick='" + this.classID + ".GoToPage(" + this.classID + ".PageIndex + 2); return false;'>" + "\n" +
                     "                  <span>Next</span></a>&nbsp;&nbsp; </span>" + "\n" +
                     "           </td>" + "\n" +
                     "           <td class='Pager' style='width: 7%' >" + "\n" +
                     "               <span style='visibility: hidden'><a href='' onclick='" + this.classID + ".GoToPage(" + this.classID + ".TotalPages); return false;'>" + "\n" +
                     "                   <span>Last</span></a>&nbsp;&nbsp; </span>" + "\n" +
                     "           </td>" + "\n" +
                     "       </tr>" + "\n" +
                     "   </table>" + "\n" +
                     "   </div>" + "\n" +
                     "</div>" + "\n"
        document.write(outStr);
   
    } 
    
    this.onRowClick = function(row, cell) {
        //This should be overridden if you want to handel the onClick events.
    }
    
    this.startEdit = function(cell) {
        var txt = cell.innerText;
        cell.oldValue = txt;
        cell.innerHTML = "<input type='text' value='" + txt + "' id='edtCell' style='background-color: transparent; border-style: none;' />";
        cell.detachEvent('onclick', SelectUnselectRow);
        cell.detachEvent('onselectstart', ReturnFalse);
        $('edtCell').focus();
        $('edtCell').select();
        $('edtCell').attachEvent('onblur', doneEdit);
        $('edtCell').attachEvent('onkeypress', checkEditKey);
    }
    
    
    
      
}; 

//Sorting Functions
function fSortByColumn(evt, classID) {

   var cell = evt['srcElement'];
   if (!cell) {
        cell = evt.currentTarget;
   }
   while(cell.tagName!="TD"){
        cell = cell.parentNode;
   }
   
    var tbl = document.getElementById(classID + '_TABLE');
    var columnNumber = parseInt(cell.id.split("-")[1]); 
    var gridObject = tbl.GridView;

    //To save time, just reverse the sort if it's already sorted by this column.
    if (gridObject.GridStyle.ColumnStyles[columnNumber].__sorted != null) {
        gridObject.DataTable.Rows.reverse();
        gridObject.DataBind(gridObject.DataTable);
        return;
    }
    
    //Clear out any soreted column flags
    var colStyle;
    for (colStyle in gridObject.GridStyle.ColumnStyles) {
        gridObject.GridStyle.ColumnStyles[colStyle].__sorted = null;
    }
    gridObject.GridStyle.ColumnStyles[columnNumber].__sorted = true;
    g_CurrentSortColumnID = gridObject.GridStyle.ColumnStyles[columnNumber].MappingName;
  
    if (!gridObject.SortFunction) {    
        gridObject.DataTable.Rows.sort(sortString);
    }
    else {
        gridObject.DataTable.Rows.sort(gridObject.SortFunction);
    }
    gridObject.DataBind(gridObject.DataTable);
}

function sortString(a,b) {
    if (a[g_CurrentSortColumnID] < b[g_CurrentSortColumnID]) {return -1};
    if (a[g_CurrentSortColumnID] > b[g_CurrentSortColumnID]) {return 1};
    return 0;
}


function ReturnFalse(evt)
{
    return false;
}

function syncScroll(evt)
{
  var div = evt['srcElement'];
  if (!div) {
    div = evt.currentTarget;
  }
  var tbl = div.firstChild;
  while(tbl.tagName!="TABLE"){
        tbl = tbl.nextSibling;
   }
  var gridObject = tbl.GridView;
  
  var head = document.getElementById(gridObject.classID + '_HEADER');
  var headDiv = head.parentNode;
   headDiv.scrollLeft = div.scrollLeft;
 
}

function SelectUnselectRow(evt)
{
   cell = evt['srcElement'];
   if (!cell) {
        cell = evt.currentTarget;
   }
   while(cell.tagName!="TD"){
        cell = cell.parentNode;
   }
   row = cell.parentNode; 
   while(row.tagName!="TR"){
        row = row.parentNode;
   }
   tbl = row.parentNode;
   while(tbl.tagName!="TABLE"){
        tbl = tbl.parentNode;
   }
   
   var cName = tbl.GridView.GridStyle.SelRowClass;
   
   
   //Single Selection
   if (tbl.GridView.GridStyle.SelectionMode=='One')
   { 
       if (row.IsSelected) {  
            tbl.GridView.UnselectRow(row);
       }
       else { 
           for(var i=0;i<tbl.rows.length; i++) {
                tbl.GridView.UnselectRow(tbl.rows[i]);
           } 
           tbl.GridView.SelectRow(row);
       }
   }
   else if (tbl.GridView.GridStyle.SelectionMode=='Cell')
   //Cell selection 
   {
       for(var i=0;i<tbl.rows.length; i++)
       {
            tbl.GridView.UnselectRow(tbl.rows[i]);
       } 
       tbl.GridView.SelectCell(cell);
   }
   else if (tbl.GridView.GridStyle.SelectionMode=='Multiple')
   //Multiple Selection
   {
       if (row.IsSelected)
       {  tbl.GridView.UnselectRow(row);}
       else
       { tbl.GridView.SelectRow(row);}
   }
   
   if (cell.isEditable) {
        tbl.GridView.startEdit(cell);
   }
   
  // tbl.GridView.onRowClick(row, cell);
   
}

function doneEdit(evt, cancel) {
   txtBox = evt['srcElement'];
   
   cell = txtBox.parentNode;
   while(cell.tagName!="TD"){
        cell = cell.parentNode;
   }
   row = cell.parentNode; 
   while(row.tagName!="TR"){
        row = row.parentNode;
   }
   tbl = row.parentNode;
   while(tbl.tagName!="TABLE"){
        tbl = tbl.parentNode;
   }
   
   if (!cancel) {
       var txt = txtBox.value;
       cell.innerHTML = txt;
       row.DataRow[cell.columnId] = txt;
       row.DataRow.HasChanged = true;  
   }
   else {
       cell.innerHTML = cell.oldValue;
  } 
  cell.attachEvent('onselectstart', ReturnFalse);
  cell.attachEvent('onclick', SelectUnselectRow);
}

function checkEditKey(evt) {
    if (evt.keyCode == 13) {
        doneEdit(evt, false);
    }
    else if (evt.keyCode == 27) {
        doneEdit(evt, true);
    }
}