From d1477a057a70c54850f8b8ff4fa7599909ef05a7 Mon Sep 17 00:00:00 2001 From: rolux Date: Fri, 20 May 2011 13:46:52 +0200 Subject: [PATCH] several improvements to autocomplete --- demos/form2/js/form.js | 3 +++ source/Ox.UI/js/Form/Ox.Input.js | 41 +++++++++++++++++++++----------- source/Ox.UI/js/Menu/Ox.Menu.js | 6 ++--- 3 files changed, 33 insertions(+), 17 deletions(-) diff --git a/demos/form2/js/form.js b/demos/form2/js/form.js index f65fce84..7c31bf90 100644 --- a/demos/form2/js/form.js +++ b/demos/form2/js/form.js @@ -88,6 +88,8 @@ Ox.load('Geo', function() { { id: "", title: "goToOut" }, { id: "", title: "setIn" }, { id: "", title: "setOut" }, + { id: "", title: "goToPoster" }, + { id: "", title: "setPoster" }, { id: "", title: "center" }, { id: "", title: "zoom" }, { id: "", title: "grow" }, @@ -109,6 +111,7 @@ Ox.load('Geo', function() { { id: "", title: "warning" }, { id: "", title: "help" }, { id: "", title: "check" }, + { id: "", title: "embed" }, { id: "", title: "bracket" }, { id: "", title: "delete" }, { id: "", title: "download" }, diff --git a/source/Ox.UI/js/Form/Ox.Input.js b/source/Ox.UI/js/Form/Ox.Input.js index 1edaafe9..e737dbe9 100644 --- a/source/Ox.UI/js/Form/Ox.Input.js +++ b/source/Ox.UI/js/Form/Ox.Input.js @@ -270,7 +270,7 @@ Ox.Input = function(options, self) { function autocomplete(oldValue, oldCursor) { oldValue = Ox.isUndefined(oldValue) ? self.options.value : oldValue; - oldCursor = Ox.isUndefined(oldCursor) ? cursor : oldCursor; + oldCursor = Ox.isUndefined(oldCursor) ? cursor() : oldCursor; Ox.print('autocomplete', oldValue, oldCursor) @@ -290,7 +290,12 @@ Ox.Input = function(options, self) { } } if (!self.options.value) { - self.options.autocompleteSelect && self.$autocompleteMenu.hideMenu(); + if (self.options.autocompleteSelect) { + self.$autocompleteMenu + .unbindEvent('select') + .hideMenu(); + self.selectEventBound = false; + } } function autocompleteFunction() { @@ -328,6 +333,7 @@ Ox.Input = function(options, self) { //Ox.print('selectEnd', selectEnd) if (self.options.autocompleteReplace) { + value = self.options.value; self.options.value = newValue; self.$input.val(self.options.value); if (selectEnd) { @@ -341,7 +347,7 @@ Ox.Input = function(options, self) { } if (self.options.autocompleteSelect) { - value = self.options.value.toLowerCase(); + value = (self.options.autocompleteReplace ? value : self.options.value).toLowerCase(); if (values.length) { self.oldCursor = cursor(); self.oldValue = self.options.value; @@ -364,11 +370,20 @@ Ox.Input = function(options, self) { return ret; }) }); + if (!self.selectEventBound) { + self.$autocompleteMenu.bindEvent({ + select: selectMenu, + }); + self.selectEventBound = true; + } self.$autocompleteMenu.options({ selected: selected }).showMenu(); } else { - self.$autocompleteMenu.hideMenu(); + self.$autocompleteMenu + .unbindEvent('select') + .hideMenu(); + self.selectEventBound = false; } } @@ -394,12 +409,6 @@ Ox.Input = function(options, self) { .bindEvent({ click: clickMenu }); - if (self.options.autocompleteReplace) { - menu.bindEvent({ - deselect: deselectMenu, - select: selectMenu, - }); - } return menu; } @@ -605,6 +614,8 @@ Ox.Input = function(options, self) { } function deselectMenu() { + return; + Ox.print('deselectMenu') self.options.value = self.oldValue; self.$input.val(self.options.value); cursor(self.oldCursor); @@ -685,10 +696,12 @@ Ox.Input = function(options, self) { function selectMenu(event, data) { var pos = cursor(); - //Ox.print('selectMenu', pos) - self.options.value = data.title - self.$input.val(self.options.value); - cursor(pos[0], self.options.value.length) + //if (self.options.value) { + Ox.print('selectMenu', pos, data.title) + self.options.value = data.title + self.$input.val(self.options.value); + cursor(pos[0], self.options.value.length); + //} } function setPlaceholder() { diff --git a/source/Ox.UI/js/Menu/Ox.Menu.js b/source/Ox.UI/js/Menu/Ox.Menu.js index eca75e8a..ba464f72 100644 --- a/source/Ox.UI/js/Menu/Ox.Menu.js +++ b/source/Ox.UI/js/Menu/Ox.Menu.js @@ -404,7 +404,7 @@ Ox.print(options) if (self.options.selected > -1) { //Ox.print('s.o.s', self.options.selected, that.items) item = that.items[self.options.selected] - item.removeClass('OxSelected'); + item && item.removeClass('OxSelected'); /* disabled that.triggerEvent('deselect', { id: item.options('id'), @@ -422,12 +422,12 @@ Ox.print(options) }); item.options('items').length && that.submenus[item.options('id')].showMenu(); // fixme: do we want to switch to this style? item.addClass('OxSelected'); - /* disabled + ///* disabled that.triggerEvent('select', { id: item.options('id'), title: Ox.stripTags(item.options('title')[0]) }); - */ + //*/ } self.options.selected = position; }