X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/examples/grid/list-view.js

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 <i>(0 items selected)</i>',
+        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 <i>('+l+' item'+s+' selected)</i>');
+    });
+});