]> git.proxmox.com Git - proxmox-widget-toolkit.git/commitdiff
KVComboBox: imported from pve-manager
authorDietmar Maurer <dietmar@proxmox.com>
Sat, 25 Feb 2017 09:20:12 +0000 (10:20 +0100)
committerDietmar Maurer <dietmar@proxmox.com>
Sat, 25 Feb 2017 09:20:12 +0000 (10:20 +0100)
Makefile
form/KVComboBox.js [new file with mode: 0644]

index c6ed0345397eebddc6fdf97006ea055fa492d07e..da69925adcd4f09b735644a9f9d00b42c79a7830 100644 (file)
--- a/Makefile
+++ b/Makefile
@@ -23,6 +23,7 @@ JSSRC=                                        \
        form/IntegerField.js            \
        form/TextField.js               \
        form/Checkbox.js                \
+       form/KVComboBox.js              \
        grid/ObjectGrid.js              \
        grid/PendingObjectGrid.js       \
        panel/InputPanel.js             \
diff --git a/form/KVComboBox.js b/form/KVComboBox.js
new file mode 100644 (file)
index 0000000..120c13b
--- /dev/null
@@ -0,0 +1,72 @@
+/* Key-Value ComboBox
+ *
+ * config properties:
+ * comboItems: an array of Key - Value pairs
+ * deleteEmpty: if set to true (default), an empty value received from the
+ * comboBox will reset the property to its default value
+ */
+Ext.define('proxmox.form.KVComboBox', {
+    extend: 'Ext.form.field.ComboBox',
+    alias: 'widget.proxmoxKVComboBox',
+
+    deleteEmpty: true,
+    comboItems: undefined,
+    displayField: 'value',
+    valueField: 'key',
+    queryMode: 'local',
+
+    // overide framework function to implement deleteEmpty behaviour
+    getSubmitData: function() {
+        var me = this,
+            data = null,
+            val;
+        if (!me.disabled && me.submitValue) {
+            val = me.getSubmitValue();
+            if (val !== null && val !== '' && val !== '__default__') {
+                data = {};
+                data[me.getName()] = val;
+            } else if (me.deleteEmpty) {
+                data = {};
+                data['delete'] = me.getName();
+            }
+        }
+        return data;
+    },
+
+    validator: function(val) {
+       var me = this;
+
+       if (me.editable || val === null || val === '') {
+           return true;
+       }
+
+       if (me.store.getCount() > 0) {
+           var values = me.multiSelect ? val.split(me.delimiter) : [val];
+           var items = me.store.getData().collect('value', 'data');
+           if (Ext.Array.every(values, function(value) {
+               return Ext.Array.contains(items, value);
+           })) {
+               return true;
+           }
+       }
+
+       // returns a boolean or string
+       /*jslint confusion: true */
+       return "value '" + val + "' not allowed!";
+    },
+
+    initComponent: function() {
+       var me = this;
+
+       me.store = Ext.create('Ext.data.ArrayStore', {
+           model: 'KeyValue',
+           data : me.comboItems
+       });
+
+       if (me.initialConfig.editable === undefined) {
+           me.editable = false;
+       }
+
+       me.callParent();
+    }
+});