Ext checkbox

Ext.require([

     'Ext.grid.*' ,

     'Ext.data.*' ,

     'Ext.util.*' ,

     'Ext.grid.PagingScroller' ,

     'Ext.ux.RowExpander' ,

     'Ext.selection.CheckboxModel'

     

]);

 

Ext.onReady( function (){

     Ext.define( 'ForumThread' , {

         extend:  'Ext.data.Model' ,

         fields: [

             'title' ,  'forumtitle' ,  'forumid' ,  'author' ,

             {name:  'replycount' , type:  'int' },

             {name:  'lastpost' , mapping:  'lastpost' , type:  'date' , dateFormat:  'timestamp' },

             'lastposter' ,  'excerpt' ,  'threadid'

         ],

         idProperty:  'threadid'

     });

 

     // create the Data Store

      var  sm = Ext.create( 'Ext.selection.CheckboxModel' );

     

     var  store = Ext.create( 'Ext.data.Store' , {

         id:  'store' ,

         pageSize: 200,

         model:  'ForumThread' ,

         remoteSort:  true ,

         // allow the grid to interact with the paging scroller by buffering

         buffered:  true ,

         proxy: {

             // load using script tags for cross domain, if the data in on the same domain as

             // this page, an HttpProxy would be better

             type:  'jsonp' ,

             url:  'http://www.sencha.com/forum/remote_topics/index.php' ,

             extraParams: {

                 total: 50000

             },

             reader: {

                 root:  'topics' ,

                 totalProperty:  'totalCount'

             },

             // sends single sort as multi parameter

             simpleSortMode:  true

         },

         sorters: [{

             property:  'lastpost' ,

             direction:  'DESC'

         }]

     });

 

     function  renderTopic(value, p, record) {

         return  Ext.String.format(

             '<a href="http://sencha.com/forum/showthread.php?t={2}" target="_blank">{0}</a>' ,

             value,

             record.data.forumtitle,

             record.getId(),

             record.data.forumid

         );

     }

 

     var  sm = Ext.create( 'Ext.selection.CheckboxModel' );

      

     var  grid = Ext.create( 'Ext.grid.Panel' , {

         width: 700,

         height: 500,

         title:  'checkbox' ,

         store: store,

         selModel: sm,

         frame:  true ,

         verticalScrollerType:  'paginggridscroller' ,

         loadMask:  true ,

         disableSelection:  false ,

         invalidateScrollerOnRefresh:  false ,

         viewConfig: {

         trackOver:  false

         },

         // grid columns

         columns:[{

             id:  'topic' ,

             text:  "Topic" ,

             dataIndex:  'title' ,

             flex: 1,

             renderer: renderTopic,

             sortable:  false

         },{

             text:  "Author" ,

             dataIndex:  'author' ,

             width: 100,

             hidden:  true ,

             sortable:  true

         },{

             text:  "Replies" ,

             dataIndex:  'replycount' ,

             align:  'center' ,

             width: 70,

             sortable:  false

         },{

             id:  'last' ,

             text:  "Last Post" ,

             dataIndex:  'lastpost' ,

             width: 130,

             renderer: Ext.util.Format.dateRenderer( 'n/j/Y g:i A' ),

             sortable:  true

         }],

         renderTo:  'grid-example'

     });

 

     

    // trigger the data store load

     store.guaranteeRange(0, 199);