Upgrade to ExtJS 3.1.0 - Released 12/16/2009
[extjs.git] / examples / simple-widgets / editor.js
diff --git a/examples/simple-widgets/editor.js b/examples/simple-widgets/editor.js
new file mode 100644 (file)
index 0000000..91e7641
--- /dev/null
@@ -0,0 +1,87 @@
+/*!
+ * Ext JS Library 3.1.0
+ * Copyright(c) 2006-2009 Ext JS, LLC
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+Ext.onReady(function(){\r
+    var ct = new Ext.form.FormPanel({\r
+        renderTo: 'container',\r
+        width: 700,\r
+        height: 400,\r
+        title: 'User Details',\r
+        defaultType: 'textfield',\r
+        padding: 10,\r
+        labelWidth: 90,\r
+        items: [{\r
+            fieldLabel: 'First Name'\r
+        }, {\r
+            fieldLabel: 'Middle Name'\r
+        }, {\r
+            fieldLabel: 'Last Name'\r
+        }, {\r
+            xtype: 'datefield',\r
+            fieldLabel: 'D.O.B'\r
+        }],\r
+        listeners: {\r
+            afterrender: function(form){\r
+                var cfg = {\r
+                    shadow: false,\r
+                    completeOnEnter: true,\r
+                    cancelOnEsc: true,\r
+                    updateEl: true,\r
+                    ignoreNoChange: true\r
+                };\r
+\r
+                var labelEditor = new Ext.Editor(Ext.apply({\r
+                    alignment: 'l-l',\r
+                    listeners: {\r
+                        beforecomplete: function(ed, value){\r
+                            if(value.charAt(value.length - 1) != ':'){\r
+                                ed.setValue(ed.getValue() + ':');\r
+                            }\r
+                            return true;\r
+                        },\r
+                        complete: function(ed, value, oldValue){\r
+                            Ext.example.msg('Label Changed', '"{0}" changed to "{1}"', oldValue, value);\r
+                        }\r
+                    },\r
+                    field: {\r
+                        allowBlank: false,\r
+                        xtype: 'textfield',\r
+                        width: 90,\r
+                        selectOnFocus: true\r
+                    }\r
+                }, cfg));\r
+                form.body.on('dblclick', function(e, t){\r
+                    labelEditor.startEdit(t);\r
+                }, null, {\r
+                    delegate: 'label.x-form-item-label'\r
+                });\r
+\r
+                var titleEditor = new Ext.Editor(Ext.apply({\r
+                    cls: 'x-small-editor',\r
+                    alignment: 'bl-bl?',\r
+                    offsets: [0, 3],\r
+                    listeners: {\r
+                        complete: function(ed, value, oldValue){\r
+                            Ext.example.msg('Title Changed', '"{0}" changed to "{1}"', oldValue, value);\r
+                        }\r
+                    },\r
+                    field: {\r
+                        width: 110,\r
+                        triggerAction: 'all',\r
+                        xtype: 'combo',\r
+                        editable: false,\r
+                        forceSelection: true,\r
+                        store: ['User Details', 'Developer Details', 'Manager Details']\r
+                    }\r
+                }, cfg));\r
+\r
+                form.header.child('.x-panel-header-text').on('dblclick', function(e, t){\r
+                    titleEditor.startEdit(t);\r
+                });\r
+            }\r
+        }\r
+    });\r
+});
\ No newline at end of file