function xcdTable() { var jsonStr = document.getElementById('xcdWorkingOrderPage').value; var header = new Array(); header[0] = ["协查单编号", "workingOrderCode","20%",""]; header[1] = ["协查单标题", "workingOrderTitle","40%",""]; header[2] = ["协查单开始时间", "startTime","20%",""]; header[3] = ["协查单结束时间", "endTime","20%",""]; window.pagging = new table_pagging({limit:3,tableId:'xcdWorkingOrderTable',header:header}); pagging.pagging(jsonStr); } var table_pagging = function(){ this.init.apply(this, arguments); } table_pagging.prototype={ init:function(s){ //从第几个数据开始获取,缺省状态下从0开始显示 if(s.start){ this.start = parseInt(s.start); }else{ this.start = 0; } //limit是指从start开始一共要用几条数据,缺省状态下显示10条 if(s.limit){ this.limit = parseInt(s.limit); }else{ this.limit = 10; } //cellStep表示每行要显示的行数.缺省状态下为1,一行一条记录. if(s.cellStep){ this.cellStep = parseInt(s.cellStep); }else{ this.cellStep = 1; } //要执行的表的名字 if(s.tableId){ this.tableObj = document.getElementById(s.tableId); }else{ alert("missing table id~"); } //头部的样式编码 if(s.headTrClassName){ this.headTrClassName = s.headTrClassName; }else{ this.headTrClassName = ""; } if(s.trClassName){ this.trClassName = s.trClassName; }else{ this.trClassName = ""; } //定义头部信息 if(this.checkHeadersIsArray(s.header)){ this.header = s.header; }else{ alert("header is wrong~"); } //初始化头部 this.createTableHeader(); }, cloumnModel:function(){ } , pagging:function(objectJson){ this.objectlist = eval('('+objectJson+')'); if(this.start+this.limit >=this.objectlist.length){ this.end =this.objectlist.length; }else{ this.end = this.start+this.limit; } this.clearSearchTable(); this.createTableBodyTd(); }, checkHeadersIsArray:function(header){ if(!(header instanceof Array)){ return false; } for(var i=0;i<header.length;i++){ if(!(header[i] instanceof Array) || header[i].length<4){ return false; } } return true; }, //清空表格数据 clearSearchTable:function(){ for(var i =this.tableObj.rows.length;i>1;i--){ this.tableObj.deleteRow(i-1); } }, //创建头部 createTableHeader:function(){ var tr = this.tableObj.insertRow(this.tableObj.rows.length); if(this.headTrClassName){ tr.className = this.headTrClassName; } var rowLength = this.header.length; for(var i=0;i<rowLength;i++){ var td = tr.insertCell(i); td.innerHTML = this.header[i][0]; if(this.header[i][2]){ td.width=this.header[i][2]; } } }, //创建table的数据区域 createTableBodyTd:function(){ this.clearSearchTable(); if(this.start>this.objectlist.length){ return; } if(this.start>this.end){ return; } if(this.end>this.objectlist.length){ this.end = this.objectlist.length; } var rowLength = this.header.length; for(var i=this.start;i<this.end;i++){ var tr = this.tableObj.insertRow(this.tableObj.rows.length); if(this.trClassName){ tr.className= this.trClassName; } for(var j=0;j<this.cellStep;j++){ for(var k=0;k<rowLength;k++){ var td = tr.insertCell(rowLength*j+k); var tdContext = " "; var tdTitle=""; if(this.header[k][1]){ var reg = /\%\{([\d\w.]+)\}\%/g; if(result = reg.exec(this.header[k][1])){ // var result = reg.exec(this.header[k][1]); var context = this.header[k][1]; while(reg.lastIndex != 0){ var value = this.getData(this.objectlist[i],result[1]); context = context.replace( /\%\{[\d\w.]+\}\%/,value); result = reg.exec(this.header[k][1]); } tdContext = context; }else{ tdContext = this.getData(this.objectlist[i],this.header[k][1]); } }else{ tdContext = " "; } if(tdContext instanceof Object){ tdContext=this.formateDate(tdContext); } if(!tdTitle){ tdTitle = tdContext; } if(this.header[k][3] && !(tdContext == " ")){ td.title = tdTitle; tdContext = tdContext+""; if(tdContext.length > parseInt(this.header[k][3])){ tdContext = tdContext.substring(0,this.header[k][3])+".."; } } td.innerHTML=tdContext; } i = i+j; if(i>=this.start+this.limit){ break; } } if(i>=this.start+this.limit){ break; } } this.createPageTr(); }, //从json获取数据,其中key如果带有.这个符号,说明需要获取的数据是多维数组(也可以看成对象) getData:function(arrayObj,key){ if(key.indexOf(".")>0){ var keys = key.split("."); var obj; for(var c = 0;c<keys.length;c++){ if(c == keys.length-1){ return obj[keys[c]]; } if(!arrayObj[keys[c]]){ return " " }else{ obj = arrayObj[keys[c]] } } }else{ return arrayObj[key]; } }, //格式化Date数据 formateDate:function(dateObj){ if(dateObj.month){ return parseInt(dateObj.month)+1+"-"+dateObj.date+" "+dateObj.hours+":"+dateObj.minutes+":"+dateObj.seconds; }else{ return dateObj; } }, operator:function(_start,_end){ this.start = _start; this.end = _end; this.createTableBodyTd(); }, //获取当前对象名 getObjectName:function(){ for(var a in window){ if(window[a]==this){ return a; } } }, // 创建尾部,上一页,下一页,当前页之类信息 createPageTr : function() { var objectName = this.getObjectName(); var tr = this.tableObj.insertRow(this.tableObj.rows.length); td = tr.insertCell(0); td.colSpan = this.header.length + ''; var totalPage = Math.ceil(this.objectlist.length / this.limit); var currentPage = Math.ceil(this.start / this.limit); var tableName = objectName + "assrotCurrentIndexTable"; td.innerHTML = "<table id='" + tableName + "' width='100%'></table>"; var tableObj = document.getElementById(tableName); var tr = tableObj.insertRow(0); var td1 = tr.insertCell(0); td1.width = "15%"; td1.align = "center"; if (this.start >= this.limit) { td1.innerHTML = "<a href='javascript:" + objectName + ".operator(0," + this.limit + ")'>首页</a>"; } else { td1.innerHTML = "<a>首页</a>"; } var td2 = tr.insertCell(1); td2.width = "15%"; td2.align = "center"; if (this.start >= this.limit) { td2.innerHTML = "<a href='javascript:" + objectName + ".operator(" + (this.start - this.limit) + "," + this.start + ")'>上一页</a>"; } else { td2.innerHTML = "<a>上一页</a>"; } var td3 = tr.insertCell(2); td3.width = "20%"; td3.align = "center"; // td3.innerHTML = "Page <input id='table_pagging_page_input_id' // type='text' size='1' id='currentIndex' value='"+(currentPage+1)+"' // >of "+totalPage; td3.innerHTML = "<input type=\"text\" id=\"goPageNo\" value=\"" + (currentPage + 1) + "\" size=\"3\" /><input type=\"button\" value=\"跳转\" onclick=\"javascript:" + objectName + ".jump2PageNum()\" />"; var td4 = tr.insertCell(3); td4.width = "15%"; td4.align = "center"; if (this.end >= this.objectlist.length) { td4.innerHTML = "<a>下一页<a>"; } else { if ((this.end + this.limit) > this.objectlist.length) { td4.innerHTML = "<a href='javascript:" + objectName + ".operator(" + this.end + "," + this.objectlist.length + ")'>下一页<a>"; } else { td4.innerHTML = "<a href='javascript:" + objectName + ".operator(" + this.end + "," + (this.end + this.limit) + ")'>下一页<a>"; } } var td5 = tr.insertCell(4); td5.width = "15%"; td5.align = "center"; if (this.end >= this.objectlist.length) { td5.innerHTML = "<a>末页</a>"; } else { td5.innerHTML = "<a href='javascript:" + objectName + ".operator(" + this.limit * (totalPage - 1) + "," + this.objectlist.length + ")'>末页</a>"; } var td6 = tr.insertCell(5); td6.align = 'right'; td6.width = "25%"; // td6.innerHTML = // "显示第"+this.start+"到第"+this.end+"记录,共"+this.objectlist.length+"条记录"; td6.innerHTML = "页数:<span style='color:blue'>" + (currentPage + 1) + "</span>/" + totalPage; }, // 点击跳转,未开发 jump2PageNum : function() { var re = /^[1-9]+[0-9]*]*$/; if (!re.test(document.getElementById('goPageNo').value)) { alert("请输入正整数"); } else { if (parseInt(document.getElementById('goPageNo').value) > Math .ceil(this.objectlist.length / this.limit)) { alert("你输入的数值过大!"); } else { this .operator( this.limit * (parseInt(document .getElementById('goPageNo').value) - 1), (this.limit * (parseInt(document .getElementById('goPageNo').value) - 1) + this.limit)); } } }, test : function() { alert(this.start); alert(this.step); alert(this.cellStep), alert(this.tablename) } }