Upgrade to ExtJS 3.0.3 - Released 10/11/2009
[extjs.git] / examples / form / vbox-form.js
diff --git a/examples/form/vbox-form.js b/examples/form/vbox-form.js
new file mode 100644 (file)
index 0000000..8fe6c0e
--- /dev/null
@@ -0,0 +1,59 @@
+/*!
+ * Ext JS Library 3.0.3
+ * Copyright(c) 2006-2009 Ext JS, LLC
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+Ext.Container.prototype.bufferResize = false;\r
+\r
+Ext.onReady(function() {\r
+    var form = new Ext.form.FormPanel({\r
+        baseCls: 'x-plain',\r
+        labelWidth: 55,\r
+        url: 'save-form.php',\r
+        layout: {\r
+            type: 'vbox',\r
+            align: 'stretch'  // Child items are stretched to full width\r
+        },\r
+        defaults: {\r
+            xtype: 'textfield'\r
+        },\r
+\r
+        items: [{\r
+            plugins: [ Ext.ux.FieldReplicator, Ext.ux.FieldLabeler ],\r
+            fieldLabel: 'Send To',\r
+            name: 'to'\r
+        },{\r
+            plugins: [ Ext.ux.FieldLabeler ],\r
+            fieldLabel: 'Subject',\r
+            name: 'subject'\r
+        }, {\r
+            xtype: 'textarea',\r
+            fieldLabel: 'Message text',\r
+            hideLabel: true,\r
+            name: 'msg',\r
+            flex: 1  // Take up all *remaining* vertical space\r
+        }]\r
+    });\r
+\r
+    var window = new Ext.Window({\r
+        title: 'Compose message',\r
+        collapsible: true,\r
+        maximizable: true,\r
+        width: 750,\r
+        height: 500,\r
+        minWidth: 300,\r
+        minHeight: 200,\r
+        layout: 'fit',\r
+        plain: true,\r
+        bodyStyle: 'padding:5px;',\r
+        buttonAlign: 'center',\r
+        items: form,\r
+        buttons: [{\r
+            text: 'Send'\r
+        },{\r
+            text: 'Cancel'\r
+        }]\r
+    });\r
+    window.show();\r
+});
\ No newline at end of file