X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/examples/grid/list-view.js?ds=sidebyside
diff --git a/examples/grid/list-view.js b/examples/grid/list-view.js
new file mode 100644
index 00000000..b4b1ee98
--- /dev/null
+++ b/examples/grid/list-view.js
@@ -0,0 +1,63 @@
+Ext.require([
+ 'Ext.grid.*',
+ 'Ext.data.*',
+ 'Ext.panel.*'
+]);
+Ext.onReady(function(){
+ Ext.define('ImageModel', {
+ extend: 'Ext.data.Model',
+ fields: ['name', 'url', {name:'size', type: 'float'}, {name:'lastmod', type:'date', dateFormat:'timestamp'}]
+ });
+ var store = Ext.create('Ext.data.JsonStore', {
+ model: 'ImageModel',
+ proxy: {
+ type: 'ajax',
+ url: 'get-images.php',
+ reader: {
+ type: 'json',
+ root: 'images'
+ }
+ }
+ });
+ store.load();
+
+ var listView = Ext.create('Ext.grid.Panel', {
+ width:425,
+ height:250,
+ collapsible:true,
+ title:'Simple ListView (0 items selected)',
+ renderTo: Ext.getBody(),
+
+ store: store,
+ multiSelect: true,
+ viewConfig: {
+ emptyText: 'No images to display'
+ },
+
+ columns: [{
+ text: 'File',
+ flex: 50,
+ dataIndex: 'name'
+ },{
+ text: 'Last Modified',
+ xtype: 'datecolumn',
+ format: 'm-d h:i a',
+ flex: 35,
+ dataIndex: 'lastmod'
+ },{
+ text: 'Size',
+ dataIndex: 'size',
+ tpl: '{size:fileSize}',
+ align: 'right',
+ flex: 15,
+ cls: 'listview-filesize'
+ }]
+ });
+
+ // little bit of feedback
+ listView.on('selectionchange', function(view, nodes){
+ var l = nodes.length;
+ var s = l != 1 ? 's' : '';
+ listView.setTitle('Simple ListView ('+l+' item'+s+' selected)');
+ });
+});