Merge branch 'dev'

qui/controls/buttons/Select.js

@@ -249,10 +249,13 @@ define('qui/controls/buttons/Select', [
             }
 
             this.$Elm.addEvents({
-                focus: this.open,
+                focus  : this.open,
                 // click: this.open,
-                blur : this.$onBlur,
-                keyup: this.$onKeyUp
+                blur   : this.$onBlur,
+                keyup  : this.$onKeyUp,
+                keydown: function (event) {
+                    event.stop();
+                }
             });
 
             this.$placeholderText = this.getAttribute('placeholderText');
@@ -710,6 +713,10 @@ define('qui/controls/buttons/Select', [
                 );
             }
 
+            if (y + MenuElm.getComputedSize().totalHeight + 20 > winSize) {
+                y = pos.y - 10 - MenuElm.getComputedSize().totalHeight;
+            }
+
             var Option = this.$Menu.getChildren(
                 this.getAttribute('name') + this.getValue()
             );
@@ -966,19 +973,21 @@ define('qui/controls/buttons/Select', [
                 return;
             }
 
-            var Elm     = this.getElm(),
-                MenuElm = this.$Menu.getElm(),
-                pos     = Elm.getPosition(document.body),
-                size    = Elm.getSize();
-
-            var x = pos.x - 20,
-                y = pos.y + size.y;
-
-            this.$Menu.setAttribute('width', size.x);
-            this.$Menu.show();
-
-            MenuElm.setStyle('top', y);
-            MenuElm.setStyle('left', x);
+            event.stop();
+            //
+            // var Elm     = this.getElm(),
+            //     MenuElm = this.$Menu.getElm(),
+            //     pos     = Elm.getPosition(document.body),
+            //     size    = Elm.getSize();
+            //
+            // var x = pos.x - 20,
+            //     y = pos.y + size.y;
+            //
+            // this.$Menu.setAttribute('width', size.x);
+            // this.$Menu.show();
+            //
+            // MenuElm.setStyle('top', y);
+            // MenuElm.setStyle('left', x);
 
             if (event.key === 'down') {
                 this.$Menu.down();
@@ -1061,8 +1070,11 @@ define('qui/controls/buttons/Select', [
             this.$Search = new Element('input', {
                 'class': 'qui-select-search',
                 events : {
-                    blur : this.$hideSearch,
-                    keyup: function (event) {
+                    blur   : this.$hideSearch,
+                    keydown: function (event) {
+                        event.stop();
+                    },
+                    keyup  : function (event) {
                         event.stop();
 
                         var value        = this.value,
@@ -1088,19 +1100,19 @@ define('qui/controls/buttons/Select', [
                             return;
                         }
 
-                        var Elm     = self.getElm(),
-                            MenuElm = self.$Menu.getElm(),
-                            pos     = Elm.getPosition(document.body),
-                            size    = Elm.getSize();
-
-                        var x = pos.x,
-                            y = pos.y + size.y;
-
-                        self.$Menu.setAttribute('width', size.x);
-                        self.$Menu.show();
-
-                        MenuElm.setStyle('top', y);
-                        MenuElm.setStyle('left', x);
+                        // var Elm     = self.getElm(),
+                        //     MenuElm = self.$Menu.getElm(),
+                        //     pos     = Elm.getPosition(document.body),
+                        //     size    = Elm.getSize();
+                        //
+                        // var x = pos.x,
+                        //     y = pos.y + size.y;
+                        //
+                        // self.$Menu.setAttribute('width', size.x);
+                        // self.$Menu.show();
+                        //
+                        // MenuElm.setStyle('top', y);
+                        // MenuElm.setStyle('left', x);
 
 
                         if (event.key === 'down') {
@@ -1120,6 +1132,8 @@ define('qui/controls/buttons/Select', [
                 }
             }).inject(this.getElm());
 
+            document.focus();
+
             this.$Search.focus();
         },
 

qui/controls/elements/Select.js

@@ -50,19 +50,20 @@ define('qui/controls/elements/Select', [
         ],
 
         options: {
-            max         : false, // max entries
-            multiple    : true,  // select more than one entry?
-            searchbutton: true,
-            name        : '',    // string
-            styles      : {
+            max            : false, // max entries
+            multiple       : true,  // select more than one entry?
+            searchbutton   : true,
+            name           : '',    // string
+            styles         : {
                 height: 120
             },
-            label       : false, // text string or a <label> DOMNode Element
-            icon        : 'fa fa-angle-right',
-            placeholder : 'Suche...',
-            child       : 'qui/controls/elements/SelectItem', // child type
-            showIds     : true, // display the ids in the search result list or not
-            asyncSearch : true  // search the results asynchronically (if set to false -> just add items without search)
+            label          : false, // text string or a <label> DOMNode Element
+            icon           : 'fa fa-angle-right',
+            placeholder    : 'Suche...',
+            child          : 'qui/controls/elements/SelectItem', // child type
+            showIds        : true, // display the ids in the search result list or not
+            asyncSearch    : true,  // search the results asynchronically (if set to false -> just add items without search)
+            allowDuplicates: true  // allow items with duplicate values
         },
 
         initialize: function (options, Input) {
@@ -258,6 +259,10 @@ define('qui/controls/elements/Select', [
          * Refresh the display
          */
         refresh: function () {
+            if (!this.$Elm) {
+                return;
+            }
+
             if (!this.getAttribute('max') || parseInt(this.getAttribute('max')) !== 1) {
                 this.$Elm.addClass('qui-elements-select-multiple');
                 return;
@@ -471,6 +476,10 @@ define('qui/controls/elements/Select', [
                 return this;
             }
 
+            if (!this.getAttribute('allowDuplicates') && this.$values.contains(id)) {
+                return this;
+            }
+
             if (this.getAttribute('max') === 1 && this.$values.length) {
                 this.$List.set('html', '');
                 this.$values = [];