extjs4 - ExtJS Paging toolbar with an ability to select items count per page -

-

im using extjs 4.2 ext.toolbar.paging , want have ability select items count on page, ie set pagesize of store.

my solution extend existing ext.toolbar.paging, maybe there easier solution? or solution can improved?

solution:

ext.require([     'ext.toolbar.paging' ]);  ext.define('ext.lib.extensions.portalpagingtoolbar', {     extend: 'ext.toolbar.paging',     alias: 'widget.portalpagingtoolbar',     alternateclassname: 'portal.pagingtoolbar',      /**      * objects per page default      */     objectsperpagedefault: 25,      /**      * objects per page text      */     objectsperpagetext: 'objects per page:',      /**      * gets paging items in toolbar      * @private      */     getpagingitems: function () {         var me = this;          return [             {                 itemid: 'first',                 tooltip: me.firsttext,                 overflowtext: me.firsttext,                 iconcls: ext.basecssprefix + 'tbar-page-first',                 disabled: true,                 handler: me.movefirst,                 scope: me             },             {                 itemid: 'prev',                 tooltip: me.prevtext,                 overflowtext: me.prevtext,                 iconcls: ext.basecssprefix + 'tbar-page-prev',                 disabled: true,                 handler: me.moveprevious,                 scope: me             },             '-',             me.beforepagetext,             {                 xtype: 'numberfield',                 itemid: 'inputitem',                 name: 'inputitem',                 cls: ext.basecssprefix + 'tbar-page-number',                 allowdecimals: false,                 minvalue: 1,                 hidetrigger: true,                 enablekeyevents: true,                 keynavenabled: false,                 selectonfocus: true,                 submitvalue: false,                 // mark not field form not catch when    getting fields                 isformfield: false,                 width: me.inputitemwidth,                 listeners: {                     scope: me,                     keydown: me.onpagingkeydown,                     blur: me.onpagingblur                 }             },             {                 xtype: 'tbtext',                 itemid: 'aftertextitem',                 text: ext.string.format(me.afterpagetext, 1)             },             '-',             {                 itemid: 'next',                 tooltip: me.nexttext,                 overflowtext: me.nexttext,                 iconcls: ext.basecssprefix + 'tbar-page-next',                 disabled: true,                 handler: me.movenext,                 scope: me             },             {                 itemid: 'last',                 tooltip: me.lasttext,                 overflowtext: me.lasttext,                 iconcls: ext.basecssprefix + 'tbar-page-last',                 disabled: true,                 handler: me.movelast,                 scope: me             },             '-',             {                 xtype: 'tbtext',                 itemid: 'objectsperpagetext',                 text: ext.string.format(me.objectsperpagetext, 1)             },             {                 xtype: 'combo',                 isformfield: false,                 itemid: 'comboitemscount',                 name: 'comboitemscount',                 store: [                     ['10', '10'],                     ['25', '25'],                     ['50', '50'],                     ['100', '100'],                     ['250', '250'],                     ['500', '500'],                     ['1000', '1000']                 ],                 width: 75,                 listeners: {                     scope: me,                     change: me.onitemsperpagechange                 }             },             '-',             {                 itemid: 'refresh',                 tooltip: me.refreshtext,                 overflowtext: me.refreshtext,                 iconcls: ext.basecssprefix + 'tbar-loading',                 handler: me.dorefresh,                 scope: me             }         ];     },      // @private     onload: function () {         var me = this,             pagedata,             pagesize,             currpage,             pagecount,             aftertext,             count,             isempty;          count = me.store.getcount();         isempty = count === 0;         if (!isempty) {             pagedata = me.getpagedata();             pagesize = pagedata.pagesize ? pagedata.pagesize : me.objectsperpagedefault;             currpage = pagedata.currentpage;             pagecount = pagedata.pagecount;             aftertext = ext.string.format(me.afterpagetext, isnan(pagecount) ? 1 : pagecount);         } else {             pagedata = me.objectsperpagedefault;             currpage = 0;             pagecount = 0;             aftertext = ext.string.format(me.afterpagetext, 0);         }          ext.suspendlayouts();         me.child('#aftertextitem').settext(aftertext);         me.child('#inputitem').setdisabled(isempty).setvalue(currpage);         me.child('#first').setdisabled(currpage === 1 || isempty);         me.child('#prev').setdisabled(currpage === 1 || isempty);         me.child('#next').setdisabled(currpage === pagecount || isempty);         me.child('#last').setdisabled(currpage === pagecount || isempty);         me.child('#comboitemscount').setdisabled(isempty).setvalue(pagesize);         me.child('#refresh').enable();         me.updateinfo();         ext.resumelayouts(true);          if (me.rendered) {             me.fireevent('change', me, pagedata);         }     },      // @private     getpagedata: function () {         var store = this.store,             totalcount = store.gettotalcount();          return {             total: totalcount,             pagesize: store.pagesize,             currentpage: store.currentpage,             pagecount: math.ceil(totalcount / store.pagesize),             fromrecord: ((store.currentpage - 1) * store.pagesize) + 1,             torecord: math.min(store.currentpage * store.pagesize, totalcount)          };     },      //@private     onitemsperpagechange: function (combo, newvalue) {         var me = this;          if(newvalue) {             me.store.pagesize = newvalue;             me.store.loadpage(1);         }     } });


Comments

Post a Comment

Popular posts from this blog

How has firefox/gecko HTML+CSS rendering changed in version 38? -

-
i have a little website header no longer renders correctly, since updating firefox 38.0.5 [the faceplant logo missing top right, , main logo no longer centred]. still renders expected in other browsers. how has engine's rendering changed in update? according mdn , list of changes is: css support ruby-position , ruby-align have been added , available default ( bug 1055676 , bug 1123917 , bug 1039006 ). the :unresolved pseudo-class has been implemented custom elements ( bug 1111633 ). the predefined style ethiopic-numeric uses space, instead of dot, suffix match recent change spec ( bug 1120721 ). css transitions on generated content (with ::before , ::after ) on both inline , block splits them start expected specification ( bug 1110277 ). the implementation of css logical properties made big progress. [...] how css transitions start has been modified match recent change of specifications, aiming @ having interoperable behavio...
Read more

android - CollapsingToolbarLayout: position the ExpandedText programmatically -

-
i using new android support design view collapsingtoolbarlayout. have need position expandedtitle programmatically. actually way set position expandedtitle in .xml file (example here: https://goo.gl/l5h5fc ) there no public api set text position programmatically , fields private . do know if it's possible without reflection or 'hacky' tricks? i have solved problem exposing properties via reflection ( https://gist.github.com/fpezzato/8e7d45112883dbbc5ffb ), works don't use trick in production code. @google: please no more private or final stuff! :)
Read more

Listeners to visualise results of load test in JMeter -

-
i want run load test in non-gui mode , save results in .csv file. (i have not modified .properties files, standard information saved) i plan load file , visualise results jmeter’s listeners. which listeners suited purpose? should avoid @ cost, might cause me misinterpret information? (e.g. in view results tree response data empty have - - not saved this. however, there has in fact been response. if saw listener might think there hasn’t been one. since want avoid this, listeners have gain information needed .csv file.) i’d know both jmeter listeners plugins. if running test in non-ui mode ideally should disable listeners in script. use '-l' option store test results .jtl extension. can later open jtl file jmeter. aggregate report or summary report should summarize test results , response time , throughput. if want plot graphs see trends on test duration can use http://jmeter-plugins.org/#/ standard , lib set. i suggest following listeners: response ...
Read more