Update Filter.js to work with Dict field.

static/plugin_dbui/src/grid/Filter.js

@@ -64,6 +64,14 @@ Ext.define('Dbui.grid.Filter', {
                     scope: me
                 });
 
+            } else if (itemType === 'xdictfield') {
+
+                item.on({
+                    change: me.onChange,
+                    keychange: me.onChange,
+                    scope: me
+                });
+
             } else {
 
                 item.on('keyup', me.onChange, me, {
@@ -106,6 +114,14 @@ Ext.define('Dbui.grid.Filter', {
                     scope: me
                 });
 
+            } else if (itemType === 'xdictfield') {
+
+                item.un({
+                    change: me.onChange,
+                    keychange: me.onChange,
+                    scope: me
+                });
+
             } else {
 
                 item.un('keyup', me.onChange, me, {
@@ -184,6 +200,69 @@ Ext.define('Dbui.grid.Filter', {
         return filter;
     },
 
+    /**
+     * Build the value to be used by the filter.
+     *
+     * Convert properly, Date, list and Dict.
+     * For List and Dict the filter operator has to be LIKE.
+     *
+     * @param {Ext.form.Field} field
+     */
+    getFilterValue: function (field) {
+
+        "use strict";
+
+        var value = field.getValue(),
+            vdict;
+
+        switch (field.xtype) {
+            case 'datefield':
+                if (value instanceof Date) {
+                    value = Ext.util.Format.date(value, field.format);
+                }
+                break;
+
+            case 'xdictfield':
+
+                //
+                // A dict is a collection of (key, value) pairs
+                // In the database the dict is encoded as a JSON string
+                // The filter value is therefore encoded as:
+                //
+                //      "%"key1": "value"%"key2": "value2"%
+                //
+                // The compararison operator has to be LIKE since it
+                // understand % as the jocker.
+                //
+                // The string "", "true" and "false" are handled properly
+                //
+
+                vdict = "";
+                Ext.Object.each(value, function (prop, val) {
+                    var s = '"' + prop + '": ';
+
+                    if (val instanceof Number) {
+                        s += val;
+
+                    } else if (val === "false" || val === "true" || val === "%") {
+                        s += val;
+
+                    } else if (!val) {
+                        s += "%";
+
+                    } else {
+                        s += '"' + val + '"';
+                    }
+
+                    vdict += (vdict.length > 0 ? '%' + s : s);
+                });
+
+                value = "%" + vdict + "%";
+                break;
+        }
+        return value;
+    },
+
     /**
      * Setup filter conditions for non buffered store
      *
@@ -266,15 +345,8 @@ Ext.define('Dbui.grid.Filter', {
             store = me.grid.getStore(),
             i, k, value, where;
 
-        // get the field value
-        value = field.getValue();
-
-        // handle date using the proper format
-        if (field.xtype === 'datefield') {
-            if (value instanceof Date) {
-                value = Ext.util.Format.date(value, field.format);
-            }
-        }
+        // get the value to be used by the filter
+        value = me.getFilterValue(field);
 
         //  update the condition dictionary
         if (Ext.isEmpty(value)) {