X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/ee06f37b0f6f6d94cd05a6ffae556660f7c4a2bc..c930e9176a5a85509c5b0230e2bff5c22a591432:/docs/source/data-view.html diff --git a/docs/source/data-view.html b/docs/source/data-view.html new file mode 100644 index 00000000..bbbafe90 --- /dev/null +++ b/docs/source/data-view.html @@ -0,0 +1,72 @@ + + + The source code + + + + + 
Ext.onReady(function(){
+    var xd = Ext.data;
+
+    var store = new Ext.data.JsonStore({
+        url: 'get-images.php',
+        root: 'images',
+        fields: ['name', 'url', {name:'size', type: 'float'}, {name:'lastmod', type:'date', dateFormat:'timestamp'}]
+    });
+    store.load();
+
+    var tpl = new Ext.XTemplate(
+		'',
+            '
',
+		    '
',
+		    '{shortName}
',
+        '',
+        '
'
+	);
+
+    var panel = new Ext.Panel({
+        id:'images-view',
+        frame:true,
+        width:535,
+        autoHeight:true,
+        collapsible:true,
+        layout:'fit',
+        title:'Simple DataView (0 items selected)',
+
+        items: new Ext.DataView({
+            store: store,
+            tpl: tpl,
+            autoHeight:true,
+            multiSelect: true,
+            overClass:'x-view-over',
+            itemSelector:'div.thumb-wrap',
+            emptyText: 'No images to display',
+
+            plugins: [
+                new Ext.DataView.DragSelector(),
+                new Ext.DataView.LabelEditor({dataIndex: 'name'})
+            ],
+
+            prepareData: function(data){
+                data.shortName = Ext.util.Format.ellipsis(data.name, 15);
+                data.sizeString = Ext.util.Format.fileSize(data.size);
+                data.dateString = data.lastmod.format("m/d/Y g:i a");
+                return data;
+            },
+            
+            listeners: {
+            	selectionchange: {
+            		fn: function(dv,nodes){
+            			var l = nodes.length;
+            			var s = l != 1 ? 's' : '';
+            			panel.setTitle('Simple DataView ('+l+' item'+s+' selected)');
+            		}
+            	}
+            }
+        })
+    });
+    panel.render(document.body);
+
+});
+ + \ No newline at end of file