docs/source/buffer.html

   1 <html>\r
   2 <head>\r
   3   <title>The source code</title>\r
   4     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   5     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   6 </head>\r
   7 <body  onload="prettyPrint();">\r
   8     <pre class="prettyprint lang-js">Ext.onReady(function(){\r
   9 \r
  10     var store = new Ext.data.Store({\r
  11         remoteSort: true,\r
  12         baseParams: {lightWeight:true,ext: 'js'},\r
  13         sortInfo: {field:'lastpost', direction:'DESC'},\r
  14         autoLoad: {params:{start:0, limit:500}},\r
  15 \r
  16         proxy: new Ext.data.ScriptTagProxy({\r
  17             url: 'http://extjs.com/forum/topics-browse-remote.php'\r
  18         }),\r
  19 \r
  20         reader: new Ext.data.JsonReader({\r
  21             root: 'topics',\r
  22             totalProperty: 'totalCount',\r
  23             idProperty: 'threadid',\r
  24             fields: [\r
  25                 'title', 'forumtitle', 'forumid', 'author',\r
  26                 {name: 'replycount', type: 'int'},\r
  27                 {name: 'lastpost', mapping: 'lastpost', type: 'date', dateFormat: 'timestamp'},\r
  28                 'lastposter', 'excerpt'\r
  29             ]\r
  30         })\r
  31     });\r
  32 \r
  33     var grid = new Ext.grid.GridPanel({\r
  34         renderTo: 'topic-grid',\r
  35         width:700,\r
  36         height:500,\r
  37         frame:true,\r
  38         title:'ExtJS.com - Browse Forums',\r
  39         trackMouseOver:false,\r
  40                 autoExpandColumn: 'topic',\r
  41         store: store,\r
  42 \r
  43         columns: [new Ext.grid.RowNumberer({width: 30}),{\r
  44             id: 'topic',\r
  45             header: "Topic",\r
  46             dataIndex: 'title',\r
  47             width: 420,\r
  48             renderer: renderTopic,\r
  49             sortable:true\r
  50         },{\r
  51             header: "Replies",\r
  52             dataIndex: 'replycount',\r
  53             width: 70,\r
  54             align: 'right',\r
  55             sortable:true\r
  56         },{\r
  57             id: 'last',\r
  58             header: "Last Post",\r
  59             dataIndex: 'lastpost',\r
  60             width: 150,\r
  61             renderer: renderLast,\r
  62             sortable:true\r
  63         }],\r
  64 \r
  65             bbar: new Ext.PagingToolbar({\r
  66                     store: store,\r
  67                     pageSize:500,\r
  68                     displayInfo:true\r
  69             }),\r
  70 \r
  71             view: new Ext.ux.grid.BufferView({\r
  72                     // custom row height\r
  73                     rowHeight: 34,\r
  74                     // render rows as they come into viewable area.\r
  75                     scrollDelay: false\r
  76             })\r
  77     });\r
  78 \r
  79 \r
  80     // render functions\r
  81     function renderTopic(value, p, record){\r
  82         return String.format(\r
  83                 '<b><a href="http://extjs.com/forum/showthread.php?t={2}" target="_blank">{0}</a></b><a href="http://extjs.com/forum/forumdisplay.php?f={3}" target="_blank">{1} Forum</a>',\r
  84                 value, record.data.forumtitle, record.id, record.data.forumid);\r
  85     }\r
  86     function renderLast(value, p, r){\r
  87         return String.format('{0}<br/>by {1}', value.dateFormat('M j, Y, g:i a'), r.data['lastposter']);\r
  88     }\r
  89 \r
  90 });\r
  91 </pre>    \r
  92 </body>\r
  93 </html>