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

Dojo 前端之家
前端之家收集整理的这篇文章主要介绍了dojo中 的 grid 的改进:增加分页导航条，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
  1. dojo.provide("navigationGrid");
  3. dojo.require("dojox.grid.DataGrid");
  4. dojo.require('dijit.Toolbar');
  5. dojo.require("dijit.form.Button");
  6. dojo.require("dijit.ToolbarSeparator");
  7. dojo.declare("navigationGrid",dojox.grid.DataGrid,{
  8. //当前页码号
  9. currentPage:1,
  10. totalPage:1,
  11. maxPageNum:5,0); background-color:inherit">//页码按钮
  12. _pageBtns:null,
    13. @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@*更新按钮的状态和样式
  59. */
  60. if(pageNo>1){
  61. this._firstBtn.set('disabled',false);
  62. this._prvIoUsBtn.set('disabled',153); font-weight:bold; background-color:inherit">false);
  63. }else{
  64. true);
  65. true);
  66. if(pageNo<this.totalPage){
  67. this._nextBtn.set('disabled',153); font-weight:bold; background-color:inherit">this._lastBtn.set('disabled',248)"> }else{
  68. }
    69. @H_502_86@//清除当前页的样式 @H_502_86@/*varcurrentPageIdx=(this.maxPageNum?this.currentPage%this.maxPageNum:this.maxPageNum)-1;
  69. varpageNoIdx=(this.maxPageNum?pageNo%this.maxPageNum:this.maxPageNum)-1;
    70. @H_502_86@pageNoIdx=pageNoIdx<0?this.maxPageNum-1:pageNoIdx;
  70. if(this._pageBtns[currentPageIdx]){
    71. @H_502_86@this._pageBtns[currentPageIdx].set('class','');
  71. }
    72. @H_502_86@if(this._pageBtns[pageNoIdx]){
  72. this._pageBtns[pageNoIdx].set('class','navi-currentPage');
    73. @H_502_86@}*/
  73. /**
  74. *重新载入当前页面
    75. @H_502_86@*/
  75. reload:function(){
  76. varrow=this._pageToRow(this._fetch(row,0); background-color:inherit">*指向导航页面
  77. _navigate:if(this.currentPage==pageNo){return}
  78. if(pageNo<1||pageNo>this.totalPage){return}
  79. this._updateBtnStatus(pageNo);
  80. this._pageToRow(pageNo-1);
  81. this.currentPage=pageNo;
    82. @H_502_86@//this._clearData();
  82. _onFetchComplete:function(items,req){
  83. if(!this.scroller){return;}
  84. if(items&&items.length>0){
    85. @H_502_86@//console.log(items);
  85. /*for(vari=0;i<this.rowsPerPage;i++){
    86. @H_502_86@if(items.length>i){
  86. this._addItem(items[i],i,true);
    87. @H_502_86@}else{
  87. this._addItem({},0); background-color:inherit">}
  88. }*/
  89. dojo.forEach(items,function(item,idx){
  90. this._addItem(item,idx,153); font-weight:bold; background-color:inherit">this);
  91. this._autoHeight){
  92. this._skipRowRenormalize=true;
  93. this.updateRowCount(items.length);
  94. this.updateRows(0,items.length);
  95. this._autoHeight){
  96. false;
  97. if(req.isRender){
  98. this.setScrollTop(0);
  99. this.postrender();
  100. elsethis._lastScrollTop){
  101. this.setScrollTop(this._lastScrollTop);
  102. deletethis._lastScrollTop;
  103. this._isLoaded){
  104. this._isLoading=false;
  105. this._isLoaded=true;
  106. this._pending_requests[req.start]=//重写父类的方法，初始化导航数字按钮
  107. _onFetchBegin:function(size,req){
  108. this._updateButtons(size);
  109. if(!size){
  110. this.views.render();
  111. this._resize();
  112. this.showMessage(this.noDataMessage);
  113. this.focus.initFocusView();
  114. return;
  115. this.showMessage();
  116. this.rowCount!=this.rowsPerPage){
  117. this.scroller.init(this.rowsPerPage,153); font-weight:bold; background-color:inherit">this.rowsPerPage);
  118. this.rowCount=this.rowsPerPage;
  119. this._setAutoHeightAttr(this.autoHeight,153); font-weight:bold; background-color:inherit">this.prerender();
  120. this.updateRowCount(this.rowsPerPage);
  121. _clearData:this.inherited(arguments);
  122. this.currentPage=1;
  123. this.totalPage=1;
  124. dojo.forEach(this._pageBtns,153); font-weight:bold; background-color:inherit">function(btn){
  125. btn.destroy();
  126. })
  127. this._firstBtn){
  128. this._prvIoUsBtn){
  129. this._nextBtn){
  130. this._lastBtn){
  131. this._pageLoaded= _updateButtons:function(size){
    132. @H_502_86@//TODO先销毁按钮组
  132. this._pageBtns){
  133. dojo.forEach(function(element){
  134. element.destroy();
  135. })
  136. this._pageBtns=[];
    137. @H_502_86@//初始化数字按钮条
  137. vartotalPage=(this.rowsPerPage?Math.ceil(size/this.rowsPerPage):size);
  138. varisShow=varisFirstRightDot=varisFirstLefttDot=varbeginIndex=4;
  139. for(vari=1;i<=totalPage;i++){
  140. if(i==1||i==2||i==totalPage||i==totalPage-1
  141. ||i==this.currentPage-1||i==this.currentPage-2
  142. ||i==this.currentPage+1||i==this.currentPage+2){
  143. isShow=this.currentPage==i){
  144. 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)
  145. this._pageBtns.push(numBtn);
  146. numBtn.set('disabled',248)"> dojo.addClass(numBtn.domNode,'navi-selected');
  147. this._naviBar.addChild(numBtn,beginIndex);
  148. beginIndex++;
  149. if(isShow==true){
  150. 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)
  151. this._pageBtns.push(numBtn);
  152. beginIndex++;
  153. if(isFirstLefttDot==false&&i==this.currentPage-3){
  154. 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){
  155. label:'...',248)"> disabled: isFirstRightDot=/*varnumBtn=newdijit.form.Button({
    156. @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@});
  156. this._pageBtns.push(numBtn);
    157. @H_502_86@this._naviBar.addChild(numBtn,i+4);
  157. this._naviBar.addChild(newdijit.form.Button({label:"...",baseClass:"",disabled:true}),btnsNum+3);
  158. varlasBtn=newdijit.form.Button({
    159. @H_502_86@label:totalPage,0); background-color:inherit">tooltip:"第"+(totalPage)+"页",totalPage) @H_502_86@})
  159. this._pageBtns.push(lasBtn);
    160. @H_502_86@this._naviBar.addChild(lasBtn,btnsNum+4);
  161. this.totalPage=totalPage;
    162. @H_502_86@//设置按钮的状态
  162. this._updateBtnStatus(this.currentPage);
    163. @H_502_86@//this._pageLoaded=true;
  163. });

猜你在找的Dojo相关文章

dojo/Deferred类和dojo/promise类的使用
参考博客：https://blog.csdn.net/blog_szhao/article/details/50220181 　　　       ...
设置查询以搜索dojo数据网格的所有字段
我有一个包含多个字段的Dojo DataGrid.我目前正在设置查询一次搜索一个字段,如下所示： gr...
dojo – 为JsonRestStore设置HTTP Accept标头
我正在使用JsonRestStore,但想为它添加一个自定义Accept标头.最好的方法是什么？ 这与diji...
dojo.query不适用于包含波形符(〜)字符的属性选择器
我需要选择一个给定其URL的链接节点.使用属性选择器的效果非常好,除了少数几个url有tilda的...
带有JSONREST问题的Dojo增强型网格
我正在尝试使用Dojo JSONREST的增强网格,我遇到了一些问题. 我一直在寻找一些例子,但无法弄...
什么时候会发布Dojo 2.0？
我使用过Dojo 1.0,但我有一些与版本相关的问题： >什么时候会发布Dojo 2.0？ >也是最...
dojo中的setSelected()DataGrid使前一个选择活动,即使对于带有selectionMode =“single”的网格也是如此
我有一个dojox.grid.DataGrid,我想以编程方式选择一行.我正在使用setSelected()这样做,它第...
dojo – 如何从dijit.form.Select中获取选项文本？
我的页面上有一个dijit.form.Select： <c:set var="qualId" value="${prev...
如何检查dojo.datagrid加载完成？
参见英文答案 > How to determine if a dojo grid has finished loading?       ...
dojo – 扩展dijit.Tree中的所有节点
有没有一种很好的方法来扩展/关闭dijit.Tree中的所有可扩展节点？ 对于那些寻找答案的人,请...
HTMLHTML5JavaScriptCSSjQueryBootstrapAngularjsTypeScriptVueDojoJsonElectronNode.jsextjsExpress XMLES6AjaxFlashUnityReactFlexAnt DesignWeb前端微信小程序微信公众号
关闭广告单独headers封装代码提示错误整数正则非0开头跳页出页码antd table提示URL未注册公众号支付vue hash模式iSlider车牌键盘循环图片echarts 双折左右布局DllPlugin对象创建打字游戏圈选两栏云函数蒙版ES2020橱窗无缝滚动轮播色块碰撞组件销毁文档操作