Add a plugin App.form.ToolTip to active tooltip for fields in form,...

Add a plugin App.form.ToolTip to active tooltip for fields in form, fieldset,...and remove the corresponding method in App.form.FormPanel.

models/dummy.py

@@ -15,7 +15,7 @@ dummy = DAL(None)
 tp_string = "tool tip for the string"
 
 dummy.define_table("foo1",
-    Field('my_string', 'string', label= "<span ext:qtip='%s'>%s</span>" % (tp_string, "My String:")),
+    Field('my_string', 'string', comment=tp_string),
     Field('my_int', 'integer', requires=IS_INT_IN_RANGE(0, 100)),
     Field('my_date', 'date'),
     Field('my_format', default='html', requires=IS_IN_SET(['html', 'latex', 'pdf'])))

models/widgets.py

@@ -8,13 +8,15 @@ from datetime import datetime
 dbui = local_import('plugin_dbui')
 
 #
-# add plugin to all grids
+# add plugin to all grids and to all forms
 #
 dbui.configure_grids(db, plugins=['pGridRowEditorConfirmDelete',
                                   'pGridRowEditorContextMenu',
                                   'pGridPaging',
                                   'pGridMathJax'])
 
+dbui.configure_forms(db, plugins=['pFormToolTip'])
+
 #
 # Modify publications fields
 #
@@ -196,7 +198,8 @@ node = dbui.Panel(html="salut ma poule")
 reportNode.add_child(T('report_1'), node)
 
 fields = dbui.to_fields(dummy.foo1)
-selector = dbui.FieldSet(items=fields, title=T('Select'))
+selector = dbui.FieldSet(items=fields, plugins=['pFormToolTip'],
+                                       title=T('Select'))
 node = dbui.PanelWithUrlSelector(baseUrl=URL('reports', 'report_2'),
                                  isMathJax=dbui.is_mathjax(),
                                  panelCfg=dbui.Panel(),

static/plugin_dbui/src/appform.js

@@ -76,9 +76,6 @@ App.form.FormPanel = Ext.extend(Ext.form.FormPanel, {
         this.buttonAction.on('click', this.doAction, this);
         this.buttonReset.on('click', resetForm, this.getForm());
         
-        // activate fields tooltip listeners
-        this.addFieldToolTipsListeners();
-        
         // link the form to the data store
         this.store = App.getDirectStore(this.store);
         this.store.on('exception', this.onStoreException, this);
@@ -89,32 +86,6 @@ App.form.FormPanel = Ext.extend(Ext.form.FormPanel, {
         this.buttonReset.setText(this.textReset);
     },
 
-    /**
-     * Private method to register fields tooltip
-     * Require the configuration parameter Ext.form.Field.tipText.
-     */
-    addFieldToolTipsListeners: function () {
-        var form;
-
-        function createToolTip(c) {
-            //NOTE: don't remove the new keyword although JSlint require it
-            new Ext.ToolTip({
-                target: c.getEl(),
-                title: c.fieldLabel,
-                anchor: 'left',
-                trackMouse: false,
-                html: Ext.util.Format.htmlEncode(c.tipText)
-            }); 
-        }   
-             
-        form = this.getForm();
-        form.items.each(function (field) {
-            if (field.tipText) {
-                field.on('render', createToolTip);
-            }
-        });
-    },
-
     /**
      * Private method to enable/disable all fields of the form
      * @param {Object} boolean

static/plugin_dbui/src/appformtooltip.js

+/**
+ * The form tooltip plugin
+ * 
+ * Acitvate tooltip associated to each field.
+ * Can be used with Ext.form.FormPanel, Ext.form.Fieldset, ....
+ * it used a dedicated Field configuration option: tipText.
+ * 
+ * The ptype of this component is pFormToolTip.
+ * 
+ * @version
+ * 
+ */
+
+Ext.namespace('App.form');
+
+App.form.ToolTip = Ext.extend(Object, {
+
+    /**
+     * Private parameter identifying the type of plugin
+     */
+    ptype: 'pFormToolTip',
+    
+    /**
+     * Plugin initialization
+     */
+    init: function (basicform) {
+        
+        var form = basicform;
+
+        function createToolTip(c) {
+            //NOTE: don't remove the new keyword although JSlint require it
+            new Ext.ToolTip({
+                target: c.getEl(),
+                title: c.fieldLabel,
+                anchor: 'left',
+                trackMouse: false,
+                html: Ext.util.Format.htmlEncode(c.tipText)
+            }); 
+        }   
+
+        if (basicform instanceof Ext.form.FormPanel) {
+            form = basicform.getForm();
+        }
+
+        form.items.each(function (field) {
+            if (field.tipText) {
+                field.on('render', createToolTip);
+            }
+        });
+    }
+});
+
+Ext.preg('pFormToolTip', App.form.ToolTip);