-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
+Ext.onReady(function(){
+ var ct = new Ext.form.FormPanel({
+ renderTo: 'container',
+ width: 700,
+ height: 400,
+ title: 'User Details',
+ defaultType: 'textfield',
+ padding: 10,
+ labelWidth: 90,
+ items: [{
+ fieldLabel: 'First Name'
+ }, {
+ fieldLabel: 'Middle Name'
+ }, {
+ fieldLabel: 'Last Name'
+ }, {
+ xtype: 'datefield',
+ fieldLabel: 'D.O.B'
+ }],
+ listeners: {
+ afterrender: function(form){
+ var cfg = {
+ shadow: false,
+ completeOnEnter: true,
+ cancelOnEsc: true,
+ updateEl: true,
+ ignoreNoChange: true
+ };
+
+ var labelEditor = new Ext.Editor(Ext.apply({
+ alignment: 'l-l',
+ listeners: {
+ beforecomplete: function(ed, value){
+ if(value.charAt(value.length - 1) != ':'){
+ ed.setValue(ed.getValue() + ':');
+ }
+ return true;
+ },
+ complete: function(ed, value, oldValue){
+ Ext.example.msg('Label Changed', '"{0}" changed to "{1}"', oldValue, value);
+ }
+ },
+ field: {
+ allowBlank: false,
+ xtype: 'textfield',
+ width: 90,
+ selectOnFocus: true
+ }
+ }, cfg));
+ form.body.on('dblclick', function(e, t){
+ labelEditor.startEdit(t);
+ }, null, {
+ delegate: 'label.x-form-item-label'
+ });
+
+ var titleEditor = new Ext.Editor(Ext.apply({
+ cls: 'x-small-editor',
+ alignment: 'bl-bl?',
+ offsets: [0, 3],
+ listeners: {
+ complete: function(ed, value, oldValue){
+ Ext.example.msg('Title Changed', '"{0}" changed to "{1}"', oldValue, value);
+ }
+ },
+ field: {
+ width: 110,
+ triggerAction: 'all',
+ xtype: 'combo',
+ editable: false,
+ forceSelection: true,
+ store: ['User Details', 'Developer Details', 'Manager Details']
+ }
+ }, cfg));
+
+ form.header.child('.x-panel-header-text').on('dblclick', function(e, t){
+ titleEditor.startEdit(t);
+ });
+ }
+ }
+ });