隨筆 - 17  文章 - 84  trackbacks - 0
          <2007年11月>
          28293031123
          45678910
          11121314151617
          18192021222324
          2526272829301
          2345678

          如非特別說(shuō)明,所有文章均為原創(chuàng)。如需引用,請(qǐng)注明出處
          Email:liangtianyu@gmail.com
          MSN:terry.liangtianyu@hotmail.com

          常用鏈接

          留言簿(4)

          隨筆分類(lèi)(12)

          隨筆檔案(17)

          最新隨筆

          搜索

          •  

          積分與排名

          • 積分 - 51901
          • 排名 - 962

          最新評(píng)論

          閱讀排行榜

          評(píng)論排行榜

          在Ext的原有分頁(yè)控件中,服務(wù)器端方法是根據(jù)傳入的起始數(shù)據(jù)記錄號(hào)(start),和顯示多少條記錄(limit)來(lái)返回當(dāng)前頁(yè)記錄的。有時(shí)候我們經(jīng)常是根據(jù)當(dāng)前頁(yè)碼(pageIndex),和每頁(yè)顯示記錄數(shù)(pageSize)來(lái)獲取當(dāng)前頁(yè)數(shù)據(jù),下面就是我根據(jù)需要自己寫(xiě)的一個(gè)對(duì)Ext.PagingToolbar的擴(kuò)展:Ext.PagingToolbarExt。

            1/**
            2 * @author Terry
            3 */

            4
            5Ext.PagingToolbarEx = Ext.extend(Ext.PagingToolbar, {
            6    afterPageText: '/ {0}',
            7    beforePageText: '頁(yè)',
            8    displayInfo: true,
            9    displayMsg: '顯示 {0} - {1} / {2}',
           10    emptyMsg: '沒(méi)有數(shù)據(jù)',
           11    firstText: '第一頁(yè)',
           12    prevText: '前一頁(yè)',
           13    nextText: '后一頁(yè)',
           14    lastText: '最后一頁(yè)',
           15    refreshText: '刷新',
           16    
           17    updateInfo: function(){
           18        if(this.displayEl){
           19            var count = this.store.getCount();
           20            
           21            var msg = count == 0 ? this.emptyMsg : String.format(this.displayMsg, this.cursor, this.cursor + count - 1this.store.getTotalCount());
           22            
           23            this.displayEl.update(msg);
           24        }

           25    }
          ,
           26    
           27    onLoad: function(store, r, o){
           28        if(!this.rendered){
           29            this.dsLoaded = [store, r, o];
           30            
           31            return;
           32        }

           33        
           34        if(!o.params || this.store.getTotalCount() == 0){
           35            this.cursor = 0;
           36        }

           37        else{
           38            this.cursor = (o.params[this.paramNames.start] - 1* this.pageSize + 1;
           39        }

           40        
           41        var d =this.getPageData(), ap = d.activePage, ps = d.pages;
           42        
           43        this.afterTextEl.el.innerHTML = String.format(this.afterPageText, d.pages);
           44        this.field.dom.value = ap;
           45        
           46        this.first.setDisabled(ap == 1 || ps == 0);
           47        this.prev.setDisabled( ap == 1 || ps == 0);
           48        this.next.setDisabled(ap == ps || ps == 0);
           49        this.last.setDisabled(ap == ps || ps == 0);
           50        this.loading.enable();
           51        this.loading.setDisabled(ps == 0);
           52        this.updateInfo();    
           53    }
          ,
           54    
           55    getPageData: function(){
           56        var total = this.store.getTotalCount();
           57        
           58        return {
           59            total: total,
           60            activePage: total != 0 && this.cursor == 0 ? 1 : Math.ceil(this.cursor / this.pageSize),
           61            pages: total !=0 && total < this.pageSize ? 1 : Math.ceil(total / this.pageSize)
           62        }

           63    }
          ,
           64    
           65    onClick: function(which){
           66        var store = this.store;
           67        var d = this.getPageData();
           68        
           69        switch(which){
           70            case 'first':
           71                this.doLoad(1);
           72                break;
           73            case 'prev':
           74                this.doLoad(Math.max(1, d.activePage - 1));
           75                break;
           76            case 'next':
           77                this.doLoad(Math.min(d.pages, d.activePage + 1));
           78                break;
           79            case 'last':
           80                this.doLoad(d.pages);
           81                break;
           82            case 'refresh':
           83                this.doLoad(d.activePage);
           84                break;
           85        }

           86    }
          ,
           87    
           88    onPagingKeydown: function(e){
           89        var k = e.getKey(), d = this.getPageData(), pageNum;
           90        
           91        if(k == e.RETURN){
           92            e.stopEvent();
           93            
           94            pageNum = this.readPage(d)
           95            
           96            if(pageNum >= d.pages){
           97                pageNum = d.pages;
           98            }

           99            else if(pageNum <= 1){
          100                pageNum = 1;
          101            }

          102            
          103            this.doLoad(pageNum);
          104    
          105        }

          106        else if(k == e.HOME || k == e.END){
          107            e.stopEvent();
          108            pageNum = k == e.HOME ? 1 : d.pages;
          109            this.field.dom.value = pageNum;
          110        }

          111        else if(k == e.UP || k == e.PAGEUP || k == e.DOWN || k == e.PAGEDOWN){
          112            e.stopEvent();
          113            
          114            if(pageNum = this.readPage(d)){
          115                var increment = e.shiftKey ? 10 : 1;
          116                
          117                if(k == e.DOWN || k == e.PAGEDOWN){
          118                    increment *= -1;
          119                }

          120                
          121                pageNum += increment;
          122                
          123                if(pageNum >= 1 & pageNum <= d.pages){
          124                    this.field.dom.value = pageNum;
          125                }

          126            }

          127        }

          128    }

          129}
          );
          130
          131Ext.reg('pagingtoolbarex', Ext.PagingToolbarEx);
          posted on 2007-11-05 08:33 Terry Liang 閱讀(16725) 評(píng)論(22)  編輯  收藏 所屬分類(lèi): Ext

          FeedBack:
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展[未登錄](méi) 2007-11-05 09:27 凍僵的魚(yú)
          不錯(cuò)哦,那么快就用上Ext2了,正為Ex2的布局頭痛~~跟1.1.1的區(qū)別太大了~~  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-05 14:27 Edward's
          請(qǐng)教個(gè)問(wèn)題,我有個(gè)TabPanel可以通過(guò)add方法來(lái)添加panel

          現(xiàn)在要在panel中添加gird,怎么實(shí)現(xiàn)  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-05 14:35 Terry Liang
          @Edward's
          所有繼承與Ext.Container的Component都可以添加其他Componet。
          Panel中添加其他Component,最簡(jiǎn)單的方法是在items中直接定義。  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-05 17:03 Edward's
          @Terry Liang
          tabsouth.add({
          title:"abc",
          items:new SampleGrid();
          }]
          }).show();
          其中tabsouth是一個(gè)tabpanel
          SampleGrid繼承Ext.grid.GridPanel
          執(zhí)行add方法的時(shí)候,不能直接顯示gird出來(lái),需要點(diǎn)擊窗口最大化  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-05 18:02 Terry Liang
          @Edward's
          我覺(jué)得是你的GridPanel沒(méi)有設(shè)置layout的原因  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-05 20:13 Edward's
          @Terry Liang
          恩,的確是layout沒(méi)設(shè)置。謝謝!  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-05 21:55 Terry Liang
          @Edward's
          不用客氣,有問(wèn)題多交流!  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-05 22:03 Edward's
          恩,又有問(wèn)題了
          在一個(gè)區(qū)域中加載頁(yè)面,其中的腳本不會(huì)執(zhí)行  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-09 15:06 Terry Liang
          @Edward's
          這個(gè)問(wèn)題我真沒(méi)特別注意過(guò),我覺(jué)得應(yīng)該和Ext的事件模式有關(guān)系吧  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-27 10:37 楊雪松
          你好,我想問(wèn)下:
          如果我想在onClick中,獲得start要怎么操作呢?應(yīng)該有特定的函數(shù)吧!
          謝謝……  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-11-27 11:19 Terry Liang
          @楊雪松
          假如你的start指的是當(dāng)前頁(yè):
          var d = this.getPageData();
          start = d.activePage;
          指的是起始記錄:
          start = this.cursor;
            回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2007-12-27 22:37 EXT使用者
          你好,我們公司正要使用EXT作一次開(kāi)發(fā),語(yǔ)言為(.net)
          由于項(xiàng)目比較急,需要有要帶頭來(lái)做這個(gè),當(dāng)然,是有報(bào)酬的,東西不復(fù)雜,但是需要對(duì)EXT比較熟悉,如果有意,請(qǐng)跟我們聯(lián)系,報(bào)酬面議
          QQ:347106
            回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2008-01-04 11:17 domino初級(jí)開(kāi)發(fā)者
          在下剛接觸ext2.0,請(qǐng)教一個(gè)關(guān)于分頁(yè)的問(wèn)題:
          ext的分頁(yè)起始是從0開(kāi)始計(jì)算,domino服務(wù)器的起始是從1開(kāi)始,服務(wù)端又不能修改,請(qǐng)問(wèn)該怎么解決,需要修改ext的什么地方?在下初次接觸ext,望不吝指教  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2008-01-04 11:53 Terry Liang
          @domino初級(jí)開(kāi)發(fā)者
          0頁(yè)還是第0條記錄?  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2008-01-07 18:13 domino初級(jí)開(kāi)發(fā)者
          謝謝Terry Liang,我說(shuō)詳細(xì)些,domino服務(wù)器的url數(shù)據(jù)請(qǐng)求是從1開(kāi)始,就是說(shuō)參數(shù)start=1是第一條記錄,start=0取不到數(shù)據(jù),而ext分頁(yè)欄的那些按鈕的計(jì)算和請(qǐng)求是從零開(kāi)始計(jì)算的
          我的數(shù)據(jù)加載代碼是:
          var store = new Ext.data.Store({ //建立數(shù)據(jù)源
          proxy: new Ext.data.HttpProxy({ //請(qǐng)求地址
          url: viewname + '?ReadViewEntries',
          method: "GET"
          }),
          baseParams:{ //設(shè)置初始請(qǐng)求參數(shù)
          outputformat: 'JSON',
          count: parseInt(rowsnum)
          },
          reader: new Ext.data.JsonReader({ //Json解析器
          totalProperty: '@toplevelentries', //數(shù)據(jù)行數(shù)
          root: 'viewentry' //數(shù)據(jù)行標(biāo)志
          }, [
          {name: 't1', mapping: 'entrydata[0]["text"]["0"]'},
          {name: 't2', mapping: 'entrydata[1]["text"]["0"]'}
          ])
          });

          store.load({params:{start:1 }});
          結(jié)果數(shù)據(jù)就從第二頁(yè)開(kāi)始顯示,而且取不到第一頁(yè)的數(shù)據(jù)

          var bbar = new Ext.PagingToolbar({ //分頁(yè)工具條
          pageSize: parseInt(rowsnum),
          store: store,
          displayInfo: true,
          displayMsg: '顯示第 {0} 條到 {1} 條記錄,一共 {2} 條',
          emptyMsg: "沒(méi)有記錄"
          });

          因?yàn)閟tore.load({params:{start:0}}); 得不到數(shù)據(jù),服務(wù)端也不能修改,我想修改ext關(guān)于分頁(yè)請(qǐng)求的代碼,把從0開(kāi)始計(jì)數(shù)修改成從1開(kāi)始計(jì)數(shù),但不知該怎么樣改,不知我說(shuō)明白沒(méi)有~~請(qǐng)不吝賜教啊,呵呵  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2008-01-08 08:31 Terry Liang
          @domino初級(jí)開(kāi)發(fā)者
          就分頁(yè)來(lái)說(shuō),其實(shí)我覺(jué)得最重要的是搞清start,limit,cursor,pageSize之間的關(guān)系。
          個(gè)人建議,你可以參照我的分頁(yè)代碼,修改onClick,onPagingKeydown,然后調(diào)整其它方法就可以了。
          我有些不明白的地方:store.load({params:{start:1 }}),假如按你所說(shuō),服務(wù)器端的方法沒(méi)錯(cuò)的話(huà),肯定返回的是第一頁(yè)數(shù)據(jù),怎么可能顯示第二頁(yè)的數(shù)據(jù)呢?
          如還有問(wèn)題,可以把可以測(cè)試的相關(guān)代碼發(fā)給我,我可以看一下。  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2008-01-08 09:38 domino初級(jí)開(kāi)發(fā)者
          呵呵,謝謝Terry Liang~
          服務(wù)器返回的數(shù)據(jù)沒(méi)錯(cuò),但是在ext的分頁(yè)工具欄上的顯示是錯(cuò)誤的,比如有四頁(yè)數(shù)據(jù),頁(yè)面加載后ext的分頁(yè)工具欄顯示的是“第二頁(yè)”,但是上面顯示的其實(shí)是是第一頁(yè)的數(shù)據(jù),因此點(diǎn)分頁(yè)工具欄上的下一頁(yè)能取到第二頁(yè)的數(shù)據(jù),但是工具欄顯示的卻是“第三頁(yè)”~~點(diǎn)擊工具欄上的“最后一頁(yè)”就只能取到倒數(shù)第二頁(yè)的數(shù)據(jù),最后一頁(yè)的數(shù)據(jù)怎么都取不到~~

          也就是說(shuō)數(shù)據(jù)是沒(méi)問(wèn)題的,但是ext的分頁(yè)欄上的顯示和那些按鈕都有問(wèn)題。

          這幾天我也在嘗試修改ext的分頁(yè)工具欄的代碼,不過(guò)由于我接觸ext還不到一個(gè)星期,感覺(jué)力不從心。嘿嘿~~
          我的MSN:combest-gg×hotmail.com,方便的話(huà)請(qǐng)幫忙看下代碼,萬(wàn)分感謝  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2008-05-16 10:32 孫子兵法
          各位老大,我在做gridPanel分頁(yè)時(shí)用到了PagingToolbar,但基本上所有的資料都只說(shuō)了用 ds.load({params:{start:0,limit:10}}); 建立一個(gè)HTTP 參數(shù)到遠(yuǎn)程數(shù)據(jù)源. 感覺(jué)這樣使用數(shù)據(jù)頁(yè)面(頁(yè)面提供數(shù)據(jù))的方法很原始,我必須在store中 使用 Ext.data.HttpProxy({url:'datapage.aspx'}), 這種方式。
          但我目前后臺(tái)AJAX類(lèi)全寫(xiě)好的,我用方法var data=getdata(20,25);就可得到服務(wù)器從第20條記錄開(kāi)始的25條數(shù)據(jù)。所以我把store使用內(nèi)存模式Ext.data.MemoryProxy(data),就行了。所有測(cè)試都OK,但PagingToolbar似乎不支持事件和方法的邦定,幫忙看下面問(wèn)題DEMO
          =============================================================================================
          Ext.onReady(function(){
          //alert(TMKSOFT.getData(20,20).value); //成功調(diào)試Json數(shù)據(jù)源,服務(wù)器Ajax方法,從服務(wù)器獲取JSON數(shù)據(jù) 數(shù)據(jù)源絕對(duì)沒(méi)問(wèn)題

          function getdata(st,pg)
          {
          data=eval('('+TMKSOFT.getData(st,pg).value+')');
          return data;
          }

          var data=getdata(20,20); //初始化調(diào)試了下,能成功顯示數(shù)據(jù)

          var store = new Ext.data.Store({
          proxy: new Ext.data.MemoryProxy(data),
          reader: new Ext.data.JsonReader({
          totalProperty: 'results',
          root: 'rows'
          }, [
          {name: 'id', mapping: 'id'},
          {name: 'name', mapping: 'name'},
          {name: 'organization',mapping: 'organization'},
          {name: 'homepage',mapping: 'homepage'},
          ])
          });

          //store.addListener('load',getdata); 想用Load偵聽(tīng),但也失敗

          var colM=new Ext.grid.ColumnModel([{header:'項(xiàng)目編號(hào)',dataIndex:'id',sortable:true},
          {header:'項(xiàng)目名稱(chēng)',dataIndex:'name',sortable:true},
          {header:'開(kāi)發(fā)團(tuán)隊(duì)',dataIndex:'organization',sortable:true},
          {header:'網(wǎng)站地址',dataIndex:'homepage',renderer:showUrl}]);

          var grid = new Ext.grid.GridPanel({
          renderTo:'hello',
          title:"中國(guó)Java開(kāi)源產(chǎn)品及團(tuán)隊(duì)",
          bodyStyle:'width:100%',
          autoWidth:true,
          height:500,
          //width:'100%',
          cm:colM,
          store:store,
          autoExpandColumn:2,
          bbar: new Ext.PagingToolbar({
          id:'pagingtoolbar',
          pageSize: 20,
          store: store,
          displayInfo: true,
          displayMsg: '顯示第 {0} 條到 {1} 條記錄,一共 {2} 條',
          emptyMsg: "沒(méi)有記錄"
          })
          });

          //var p1=document.getElementById("ext-gen30").value; //這樣可得到需要從第幾條記錄開(kāi)始
          //var p2=Ext.getCmp('pagingtoolbar').pageSize; //這樣可得到多少條紀(jì)錄
          alert(p1+" + "+p2)
          store.load({callback:getdata}); //每點(diǎn)一下PagingToolbar觸發(fā)什么事件,重調(diào)我getdata方法獲取新數(shù)據(jù),我該怎么寫(xiě)?
          });  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2008-09-24 15:32 aab
          terry,怎么判斷我點(diǎn)的是哪個(gè)翻頁(yè)按鈕,下一頁(yè)或上一頁(yè)呢?  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展[未登錄](méi) 2009-05-21 10:14 conan
          @孫子兵法
          樓主不是給了個(gè)很好的方案嗎?只要擴(kuò)展pagingToolbar,然后覆蓋需要覆蓋的方法就可以了.例如你這里的話(huà)只要覆蓋onclick方法就可以了.  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展 2009-10-11 20:59 duansky
          LZ能否好事做到底,干脆把EXT3.0的也擴(kuò)展一下.我改了一天也沒(méi)改成功! 郁悶~  回復(fù)  更多評(píng)論
            
          # re: Ext 2.0使用:對(duì)分頁(yè)Ext.PagingToolbar的擴(kuò)展[未登錄](méi) 2012-03-10 21:16 小杰
          為什么我擴(kuò)展的不顯示 displayMsg 信息。  回復(fù)  更多評(píng)論
            

          只有注冊(cè)用戶(hù)登錄后才能發(fā)表評(píng)論。


          網(wǎng)站導(dǎo)航:
           
          主站蜘蛛池模板: 新竹县| 甘孜| 都兰县| 永新县| 治多县| 大兴区| 浮山县| 霍山县| 商城县| 岳西县| 黑水县| 海丰县| 蓬溪县| 临泉县| 石嘴山市| 潼关县| 龙口市| 乌苏市| 堆龙德庆县| 萨嘎县| 东至县| 綦江县| 黄石市| 香港| 大庆市| 元阳县| 房产| 大名县| 上栗县| 万年县| 台北县| 东丽区| 辽宁省| 蒙城县| 全椒县| 昌江| 平乡县| 宽甸| 宜君县| 连城县| 来安县|