dojo中 的 grid 的改进:增加分页导航条

前端之家收集整理的这篇文章主要介绍了dojo中 的 grid 的改进:增加分页导航条前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
  1. dojo.provide("navigationGrid");
  2. dojo.require("dojox.grid.DataGrid");
  3. dojo.require('dijit.Toolbar');
  4. dojo.require("dijit.form.Button");
  5. dojo.require("dijit.ToolbarSeparator");
  6. dojo.declare("navigationGrid",dojox.grid.DataGrid,{
  7. //当前页码
  8. currentPage:1,
  9. totalPage:1,
  10. maxPageNum:5,0); background-color:inherit">//页码按钮
  11. _pageBtns:null,
  12. @H_502_86@//导航条对象
  13. _naviBar: _firstBtn: _prvIoUsBtn: _nextBtn: _lastBtn: _pageLoaded:false,108); list-style:decimal-leading-zero outside; color:inherit; line-height:24px; margin:0px!important; padding:0px 3px 0px 10px!important">
  14. postCreate:function(){
  15. this.inherited(arguments);
  16. this._pageBtns=[];
  17. this._naviBar=newdijit.Toolbar(
  18. {
  19. style:"width:100%;text-align:right"
  20. });
  21. this._firstBtn=newdijit.form.Button({
  22. label:"首页"
  23. ,disabled:true
  24. ,iconClass:"navi-first",108); list-style:decimal-leading-zero outside; color:inherit; line-height:24px; margin:0px!important; padding:0px 3px 0px 10px!important"> onClick:dojo.hitch(this,"_locate",'first')
  25. this._prvIoUsBtn= label:"上一页"
  26. "navi-prevIoUs",'pre')
  27. this._nextBtn= label:"下一页"
  28. "rtl"
  29. "navi-next",248)"> onClick:dojo.hitch('next')
  30. });
  31. this._lastBtn=newdijit.form.Button({
  32. label:"末页"
  33. true
  34. "rtl"
  35. "navi-last",'last')
  36. this._naviBar.addChild(this._firstBtn);
  37. newdijit.ToolbarSeparator());
  38. this._prvIoUsBtn);
  39. this._nextBtn);
  40. this._lastBtn);
  41. this._naviBar.placeAt(this.domNode,"after");
  42. //this._naviBar.startup();
  43. },248)"> _locate:function(s){
  44. switch(s){
  45. case'first':
  46. this._navigate(1);
  47. break;
  48. case'pre':
  49. this._navigate(this.currentPage-1);
  50. break;
  51. case'next':
  52. this.currentPage+1);
  53. case'last':
  54. this.totalPage);
  55. default:
  56. }
  57. },248)"> _updateBtnStatus:function(pageNo){
  58. /*
  59. @H_502_86@*更新按钮的状态和样式
  60. */
  61. if(pageNo>1){
  62. this._firstBtn.set('disabled',false);
  63. this._prvIoUsBtn.set('disabled',153); font-weight:bold; background-color:inherit">false);
  64. }else{
  65. true);
  66. true);
  67. if(pageNo<this.totalPage){
  68. this._nextBtn.set('disabled',153); font-weight:bold; background-color:inherit">this._lastBtn.set('disabled',248)"> }else{
  69. }
  70. @H_502_86@//清除当前页的样式 @H_502_86@/*varcurrentPageIdx=(this.maxPageNum?this.currentPage%this.maxPageNum:this.maxPageNum)-1;
  71. varpageNoIdx=(this.maxPageNum?pageNo%this.maxPageNum:this.maxPageNum)-1;
  72. @H_502_86@pageNoIdx=pageNoIdx<0?this.maxPageNum-1:pageNoIdx;
  73. if(this._pageBtns[currentPageIdx]){
  74. @H_502_86@this._pageBtns[currentPageIdx].set('class','');
  75. }
  76. @H_502_86@if(this._pageBtns[pageNoIdx]){
  77. this._pageBtns[pageNoIdx].set('class','navi-currentPage');
  78. @H_502_86@}*/
  79. /**
  80. *重新载入当前页面
  81. @H_502_86@*/
  82. reload:function(){
  83. varrow=this._pageToRow(this._fetch(row,0); background-color:inherit">*指向导航页面
  84. _navigate:if(this.currentPage==pageNo){return}
  85. if(pageNo<1||pageNo>this.totalPage){return}
  86. this._updateBtnStatus(pageNo);
  87. this._pageToRow(pageNo-1);
  88. this.currentPage=pageNo;
  89. @H_502_86@//this._clearData();
  90. _onFetchComplete:function(items,req){
  91. if(!this.scroller){return;}
  92. if(items&&items.length>0){
  93. @H_502_86@//console.log(items);
  94. /*for(vari=0;i<this.rowsPerPage;i++){
  95. @H_502_86@if(items.length>i){
  96. this._addItem(items[i],i,true);
  97. @H_502_86@}else{
  98. this._addItem({},0); background-color:inherit">}
  99. }*/
  100. dojo.forEach(items,function(item,idx){
  101. this._addItem(item,idx,153); font-weight:bold; background-color:inherit">this);
  102. this._autoHeight){
  103. this._skipRowRenormalize=true;
  104. this.updateRowCount(items.length);
  105. this.updateRows(0,items.length);
  106. this._autoHeight){
  107. false;
  108. if(req.isRender){
  109. this.setScrollTop(0);
  110. this.postrender();
  111. elsethis._lastScrollTop){
  112. this.setScrollTop(this._lastScrollTop);
  113. deletethis._lastScrollTop;
  114. this._isLoaded){
  115. this._isLoading=false;
  116. this._isLoaded=true;
  117. this._pending_requests[req.start]=//重写父类方法,初始化导航数字按钮
  118. _onFetchBegin:function(size,req){
  119. this._updateButtons(size);
  120. if(!size){
  121. this.views.render();
  122. this._resize();
  123. this.showMessage(this.noDataMessage);
  124. this.focus.initFocusView();
  125. return;
  126. this.showMessage();
  127. this.rowCount!=this.rowsPerPage){
  128. this.scroller.init(this.rowsPerPage,153); font-weight:bold; background-color:inherit">this.rowsPerPage);
  129. this.rowCount=this.rowsPerPage;
  130. this._setAutoHeightAttr(this.autoHeight,153); font-weight:bold; background-color:inherit">this.prerender();
  131. this.updateRowCount(this.rowsPerPage);
  132. _clearData:this.inherited(arguments);
  133. this.currentPage=1;
  134. this.totalPage=1;
  135. dojo.forEach(this._pageBtns,153); font-weight:bold; background-color:inherit">function(btn){
  136. btn.destroy();
  137. })
  138. this._firstBtn){
  139. this._prvIoUsBtn){
  140. this._nextBtn){
  141. this._lastBtn){
  142. this._pageLoaded= _updateButtons:function(size){
  143. @H_502_86@//TODO先销毁按钮组
  144. this._pageBtns){
  145. dojo.forEach(function(element){
  146. element.destroy();
  147. })
  148. this._pageBtns=[];
  149. @H_502_86@//初始化数字按钮条
  150. vartotalPage=(this.rowsPerPage?Math.ceil(size/this.rowsPerPage):size);
  151. varisShow=varisFirstRightDot=varisFirstLefttDot=varbeginIndex=4;
  152. for(vari=1;i<=totalPage;i++){
  153. if(i==1||i==2||i==totalPage||i==totalPage-1
  154. ||i==this.currentPage-1||i==this.currentPage-2
  155. ||i==this.currentPage+1||i==this.currentPage+2){
  156. isShow=this.currentPage==i){
  157. varnumBtn= label:i,248)"> baseClass:"",108); list-style:decimal-leading-zero outside; color:inherit; line-height:24px; margin:0px!important; padding:0px 3px 0px 10px!important"> tooltip:"第"+i+"页",248)"> style:{border:"1pxsolid#A8AAE2",margin:"1px"},108); list-style:decimal-leading-zero outside; color:inherit; line-height:24px; margin:0px!important; padding:0px 3px 0px 10px!important"> cssStateNodes:{"titleNode":"navi"},"_navigate",i)
  158. this._pageBtns.push(numBtn);
  159. numBtn.set('disabled',248)"> dojo.addClass(numBtn.domNode,'navi-selected');
  160. this._naviBar.addChild(numBtn,beginIndex);
  161. beginIndex++;
  162. if(isShow==true){
  163. label:i,108); list-style:decimal-leading-zero outside; color:inherit; line-height:24px; margin:0px!important; padding:0px 3px 0px 10px!important"> baseClass:"",248)"> tooltip:"第"+i+"页",108); list-style:decimal-leading-zero outside; color:inherit; line-height:24px; margin:0px!important; padding:0px 3px 0px 10px!important"> style:{border:"1pxsolid#A8AAE2",248)"> cssStateNodes:{"titleNode":"navi"},i)
  164. this._pageBtns.push(numBtn);
  165. beginIndex++;
  166. if(isFirstLefttDot==false&&i==this.currentPage-3){
  167. label:'...',108); list-style:decimal-leading-zero outside; color:inherit; line-height:24px; margin:0px!important; padding:0px 3px 0px 10px!important"> disabled: isFirstLefttDot=if(isFirstRightDot==false&&i>this.currentPage){
  168. label:'...',248)"> disabled: isFirstRightDot=/*varnumBtn=newdijit.form.Button({
  169. @H_502_86@label:i+1,0); background-color:inherit">baseClass:"",0); background-color:inherit">tooltip:"第"+(i+1)+"页",0); background-color:inherit">style:{border:"1pxsolid#A8AAE2",margin:"1px"},0); background-color:inherit">cssStateNodes:{"titleNode":"navi"},0); background-color:inherit">onClick:dojo.hitch(this,"_navigate",i+1) @H_502_86@});
  170. this._pageBtns.push(numBtn);
  171. @H_502_86@this._naviBar.addChild(numBtn,i+4);
  172. this._naviBar.addChild(newdijit.form.Button({label:"...",baseClass:"",disabled:true}),btnsNum+3);
  173. varlasBtn=newdijit.form.Button({
  174. @H_502_86@label:totalPage,0); background-color:inherit">tooltip:"第"+(totalPage)+"页",totalPage) @H_502_86@})
  175. this._pageBtns.push(lasBtn);
  176. @H_502_86@this._naviBar.addChild(lasBtn,btnsNum+4);
  177. this.totalPage=totalPage;
  178. @H_502_86@//设置按钮的状态
  179. this._updateBtnStatus(this.currentPage);
  180. @H_502_86@//this._pageLoaded=true;
  181. });

猜你在找的Dojo相关文章