X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/6746dc89c47ed01b165cc1152533605f97eb8e8d..f562e4c6e5fac7bcb445985b99acbea4d706e6f0:/docs/guides/grid/examples/simple_grid/app.js

diff --git a/docs/guides/grid/examples/simple_grid/app.js b/docs/guides/grid/examples/simple_grid/app.js
new file mode 100644
index 00000000..d89f4fab
--- /dev/null
+++ b/docs/guides/grid/examples/simple_grid/app.js
@@ -0,0 +1,54 @@
+/**
+ * @example Simple Grid
+ *
+ * A basic grid that renders itself to the document body.
+ */
+Ext.require('Ext.data.Store');
+Ext.require('Ext.grid.Panel');
+
+Ext.define('User', {
+    extend: 'Ext.data.Model',
+    fields: [ 'name', 'email', 'phone' ]
+});
+
+Ext.onReady(function() {
+
+    var userStore = Ext.create('Ext.data.Store', {
+        model: 'User',
+        data: [
+            { name: 'Lisa', email: 'lisa@simpsons.com', phone: '555-111-1224' },
+            { name: 'Bart', email: 'bart@simpsons.com', phone: '555-222-1234' },
+            { name: 'Homer', email: 'home@simpsons.com', phone: '555-222-1244' },
+            { name: 'Marge', email: 'marge@simpsons.com', phone: '555-222-1254' }
+        ]
+    });
+
+    Ext.create('Ext.grid.Panel', {
+        renderTo: Ext.getBody(),
+        store: userStore,
+        width: 400,
+        height: 200,
+        title: 'Application Users',
+        columns: [
+            {
+                text: 'Name',
+                width: 100,
+                sortable: false,
+                hideable: false,
+                dataIndex: 'name'
+            },
+            {
+                text: 'Email Address',
+                width: 150,
+                dataIndex: 'email',
+                hidden: true
+            },
+            {
+                text: 'Phone Number',
+                flex: 1,
+                dataIndex: 'phone'
+            }
+        ]
+    });
+
+});