0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

autocomplete, continued

Browse source
This commit is contained in:
Rolux 2010-02-18 13:26:37 +05:30
parent 301a9759db
commit 2e6f3cd64b
2 changed files with 61 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

55
build/js/ox.ui.js
View file

@ -1566,15 +1566,20 @@ requires
}); });
} }
function autocomplete(items) { function autocomplete(items) {
items = $.map(items, function(title) { if (items.length) {
return { items = $.map(items, function(title) {
id: title.toLowerCase(), // fixme: need function to do lowercase, underscores etc? return {
title: title id: title.toLowerCase(), // fixme: need function to do lowercase, underscores etc?
} title: title
}); }
self.menu.options({ });
items: items self.menu.options({
}).showMenu(); items: items
}).showMenu();
that.val(self.menu.options("items")[0].title);
} else {
self.menu.hideMenu();
}
} }
function change() { function change() {
@ -1597,14 +1602,32 @@ requires
} }
} }
function keypress() { function keypress() {
var val = that.val(); setTimeout(function() {
if (self.options.autocomplete && val != self.options.value) { var val = that.val();
self.options.value = val; if (self.options.autocomplete && val != self.options.value) {
if (val === "") { self.options.value = val;
self.menu.hideMenu(); if (val === "") {
} else { self.menu.hideMenu();
self.options.autocomplete(val, autocomplete); } else {
self.options.autocomplete(val, autocomplete);
}
} }
}, 50);
}
function select(start, end) {
var element = that.$element[0],
range;
if (element.createTextRange) {
range = element.createTextRange();
range.collapse(true);
range.moveStart("character", start);
range.moveEnd("character", end);
range.select();
} else if (element.setSelectionRange) {
element.setSelectionRange(start, end);
} else if (element.selectionStart) {
element.selectionStart = start;
element.selectionEnd = end;
} }
} }
return that; return that;

30
demos/test/index.html
View file

@ -327,15 +327,29 @@
] ]
}).addClass("margin").width(96).appendTo(mainPanel); }).addClass("margin").width(96).appendTo(mainPanel);
Ox.Input({ Ox.Input({
id: "auto", id: "state",
autocomplete: function(value, callback) { autocomplete: function(value, callback) {
callback([ value = value.toLowerCase();
"Alabama", "Alaska", "Arizona", "California", var items = [];
"Indiana", "Illinois", "Iowa", states = [
"Kansas", "Kentucky", "Alabama", "Alaska", "Arizona", "Arkansas", "California",
"Michigan", "New York", "Colorado", "Connecticut", "Delaware", "District of Columbia", "Florida",
"Tennessee" "Georgia", "Hawaii", "Idaho", "Illinois", "Indiana",
]); "Iowa", "Kansas", "Kentucky", "Louisiana", "Maine",
"Maryland", "Massachusetts", "Michigan", "Minnessota", "Mississippi",
"Missouri", "Montana", "Nebraska", "Nevada", "New Hampshire",
"New Jersey", "New Mexico", "New York", "North Carolina", "North Dakota",
"Ohio", "Oklahoma", "Oregon", "Pennsylvania", "Rhode Island",
"South Carolina", "South Dakota", "Tennessee", "Texas", "Utah",
"Vermont", "Virginia", "Washington", "West Virgina", "Wisconsin",
"Wyoming"
],
$.each(states, function(i, state) {
if (Ox.startsWith(state.toLowerCase(), value)) {
items.push(state);
}
});
callback(items);
}, },
placeholder: "State" placeholder: "State"
}).addClass("margin").width(96).appendTo(mainPanel); }).addClass("margin").width(96).appendTo(mainPanel);