Replace this by me in App.form.Panel.

static/plugin_dbui/src/form/Panel.js

@@ -4,7 +4,7 @@
  * It contains field widget for the database table fields and
  * two buttons *Action* and *Reset*.
  *
- * The store attribute is equal the table name when the widget
+ * The store attribute is equal to the table name when the widget
  * is configured. It is replaced by an App.data.DirectStore
  * in the initialization phase of the component.
  *
@@ -100,28 +100,29 @@ Ext.define('App.form.Panel', {
     // private method require by the ExtJs component model
     initComponent: function () {
 
-        var toolbar;
+        var me = this,
+            toolbar;
 
         // initialise the base class
-        this.callParent(arguments);
+        me.callParent(arguments);
 
         // short cuts
-        toolbar = this.getDockedItems()[0];
-        this.buttonAction = toolbar.getComponent('buttonAction');
-        this.buttonReset = toolbar.getComponent('buttonReset');
+        toolbar = me.getDockedItems()[0];
+        me.buttonAction = toolbar.getComponent('buttonAction');
+        me.buttonReset = toolbar.getComponent('buttonReset');
 
         // button events listeners
-        this.buttonAction.on('click', this.doAction, this);
-        this.buttonReset.on('click', this.softReset, this);
+        me.buttonAction.on('click', me.doAction, me);
+        me.buttonReset.on('click', me.softReset, me);
 
         // link the form to the data store
-        this.store = App.getStore(this.store);
-        this.store.getProxy().on('exception', this.onProxyException, this);
-        this.store.on('write', this.softReset, this);
+        me.store = App.getStore(me.store);
+        me.store.getProxy().on('exception', me.onProxyException, me);
+        me.store.on('write', me.softReset, me);
 
         // set the default action: create
-        this.setAction('create');
-        this.buttonReset.setText(this.textReset);
+        me.setAction('create');
+        me.buttonReset.setText(me.textReset);
     },
 
     /**
@@ -134,29 +135,33 @@ Ext.define('App.form.Panel', {
 
         "use strict";
 
+        var me = this;
+
         // add the new record after the selected one
-        if (this.currentIndex !== undefined) {
-            this.store.insert(this.currentIndex + 1, record);
+        if (me.currentIndex !== undefined) {
+            me.store.insert(me.currentIndex + 1, record);
 
         // add the new record at the end of the store
         } else {
-            this.store.add(record);
+            me.store.add(record);
         }
 
         // reset the index
-        this.currentIndex = undefined;
+        me.currentIndex = undefined;
     },
 
     // private method required by the ExtJS component model
     beforeDestroy: function () {
 
-        this.buttonAction.un('click', this.doAction, this);
-        this.buttonReset.un('click', this.softReset, this);
+        var me = this;
+
+        me.buttonAction.un('click', me.doAction, me);
+        me.buttonReset.un('click', me.softReset, me);
 
-        this.store.getProxy().un('exception', this.onProxyException, this);
-        this.store.un('write', this.softReset, this);
+        me.store.getProxy().un('exception', me.onProxyException, me);
+        me.store.un('write', me.softReset, me);
 
-        this.callParent(arguments);
+        me.callParent(arguments);
     },
 
     /**
@@ -167,7 +172,8 @@ Ext.define('App.form.Panel', {
 
         "use strict";
 
-        var fields = this.getForm().getFields();
+        var me = this,
+            fields = me.getForm().getFields();
 
         fields.each(function (field) {
             field.setDisabled(bool);
@@ -186,46 +192,47 @@ Ext.define('App.form.Panel', {
 
         "use strict";
 
-        var form = this.getForm(),
-            model = this.store.getProxy().getModel(),
+        var me = this,
+            form = me.getForm(),
+            model = me.store.getProxy().getModel(),
             newRecord;
 
         // No action on non-valid form except destroy
-        if (this.currantAction !== 'destroy' && !form.isValid()) {
+        if (me.currantAction !== 'destroy' && !form.isValid()) {
             return;
         }
 
-        if (!this.store) {
-            throw new Error(this.textStoreError);
+        if (!me.store) {
+            throw new Error(me.textStoreError);
         }
 
-        switch (this.currentAction) {
+        switch (me.currentAction) {
 
         case 'create':
             newRecord = model.create();
-            this.updateRecord(newRecord);
-            this.addRecord(newRecord);
+            me.updateRecord(newRecord);
+            me.addRecord(newRecord);
             break;
 
         case 'destroy':
-            this.store.remove(this.currentRecord);
+            me.store.remove(me.currentRecord);
             break;
 
         case 'duplicate':
             newRecord = model.create();
-            this.updateRecord(newRecord);
-            this.addRecord(newRecord);
+            me.updateRecord(newRecord);
+            me.addRecord(newRecord);
             break;
 
         case 'update':
-            this.currentRecord.beginEdit();
-            this.updateRecord(this.currentRecord);
-            this.currentRecord.endEdit();
+            me.currentRecord.beginEdit();
+            me.updateRecord(me.currentRecord);
+            me.currentRecord.endEdit();
             break;
         }
 
-        if (!this.store.autoSync) {
-            this.store.sync();
+        if (!me.store.autoSync) {
+            me.store.sync();
         }
     },
 
@@ -243,13 +250,14 @@ Ext.define('App.form.Panel', {
 
         "use strict";
 
-        var errors,
+        var me = this,
+            errors,
             key,
             msg = "";
 
         // invalid response from the server, HTPP 400, 500
         if (response instanceof Ext.direct.ExceptionEvent) {
-            Ext.Msg.alert(this.textError, response.xhr.responseText);
+            Ext.Msg.alert(me.textError, response.xhr.responseText);
             return;
         }
 
@@ -273,7 +281,7 @@ Ext.define('App.form.Panel', {
                     }
                 }
 
-                Ext.Msg.alert(this.textError, msg);
+                Ext.Msg.alert(me.textError, msg);
                 return;
             }
         }
@@ -292,17 +300,18 @@ Ext.define('App.form.Panel', {
 
         "use strict";
 
-        var form = this.getForm(),
+        var me = this,
+            form = me.getForm(),
             table,
             tableId;
 
-        this.buttonReset.show();
-        this.buttonAction.show();
+        me.buttonReset.show();
+        me.buttonAction.show();
 
-        this.disableFields(false);
+        me.disableFields(false);
 
-        this.currentAction = action;
-        this.currentRecord = record;
+        me.currentAction = action;
+        me.currentRecord = record;
 
         // force orginalValues to be equal to the load data
         // this is required by the softReset method.
@@ -311,33 +320,33 @@ Ext.define('App.form.Panel', {
         switch (action) {
 
         case 'create':
-            this.buttonAction.setText(this.textCreate);
+            me.buttonAction.setText(me.textCreate);
 
             // load an empty record filled with default values
-            record = this.store.getProxy().getModel().create();
+            record = me.store.getProxy().getModel().create();
             form.loadRecord(record);
             break;
 
         case 'destroy':
-            this.buttonAction.setText(this.textDestroy);
+            me.buttonAction.setText(me.textDestroy);
             form.loadRecord(record);
             break;
 
         case 'duplicate':
-            this.buttonAction.setText(this.textDuplicate);
+            me.buttonAction.setText(me.textDuplicate);
             form.loadRecord(record);
             break;
 
         case 'update':
-            this.buttonAction.setText(this.textUpdate);
+            me.buttonAction.setText(me.textUpdate);
             form.loadRecord(record);
             break;
 
         case 'view':
-            this.buttonReset.hide();
-            this.buttonAction.hide();
+            me.buttonReset.hide();
+            me.buttonAction.hide();
             form.loadRecord(record);
-            this.disableFields(true);
+            me.disableFields(true);
             break;
         }
     },
@@ -349,8 +358,9 @@ Ext.define('App.form.Panel', {
     softReset : function () {
 
         "use strict";
+        var me = this;
 
-        this.getForm().reset();
+        me.getForm().reset();
     },
 
     /**
@@ -361,7 +371,8 @@ Ext.define('App.form.Panel', {
 
         "use strict";
 
-        var combo,
+        var me = this,
+            combo,
             containers,
             fields,
             rec,
@@ -375,14 +386,14 @@ Ext.define('App.form.Panel', {
         // including those encapsulated in complexe field container
         // which encapsulated grid with cell editing...
         //
-        fields = this.query('> field');
-        fields = Ext.Array.merge(fields, this.query('fieldset > field'));
+        fields = me.query('> field');
+        fields = Ext.Array.merge(fields, me.query('fieldset > field'));
 
 
         // get the list of field container:
         // those at the first level and those encapsulated in fieldset
-        containers = this.query('> fieldcontainer');
-        containers = Ext.Array.merge(containers, this.query('fieldset > fieldcontainer'));
+        containers = me.query('> fieldcontainer');
+        containers = Ext.Array.merge(containers, me.query('fieldset > fieldcontainer'));
 
         // container handles two type of object:
         //  - composite field merging several standard field