help translating tab key to down arrow to improve autocomplete feel/usability
Hello, all -
I have an instance of http://docs.jquery.com/Plugins/Autocomplete/autocomplete working great, but I am trying to improve the feel/usability of it a little. I'd like a tab key from the input text box to be treated as a down arrow like it is in, for example, Firefox's search box (top right by default). I've tried the following variants which appear to be working as expected based on my console logging, but they don't achieve the desired effect. I'm wondering if its a focus issue or some other logic error.
- $(document).ready(function() {
$('#searchBoxID').keyup(function(event) {
if (event.which == 13) {
/* forward to autocomplete 'result()' */
$('#searchBoxID').search();
}
/* TODO tab key (9) should be translated to arrow down */
if (event.which == 9) {
/* event.which = 40 */
}
if (event.which == 40) {
$.fn.log('got keyup down! '+event);
}
});
$('#searchBoxID').keydown(function(event) {
/* TODO tab key (9) should be translated to arrow down */
if (event.which == 9) {
event.preventDefault();
event.stopImmediatePropagation();
/* event.which = 40; */
e = $.Event('keydown');
e.which = 40;
$('#searchBoxID').trigger(e);
e = $.Event('keyup');
e.which = 40;
$('#searchBoxID').trigger(e);
e = $.Event('keypress');
e.which = 40;
$('#searchBoxID').trigger(e);
}
if (event.which == 40) {
$.fn.log('got keydown down! '+event);
}
});
If I get any feedback on this and it would be helpful, I can take further steps to make a stand-alone example.
Thanks,
- Luke