Handling textbox .change when using JQuery UI Autocomplete widget -
i have search box jquery ui autocomplete function. want terms entered user compared against set of cases (see "kittens" , "puppies" in switch statement below. see jsfiddle here: http://jsfiddle.net/xcbmq/4/).
this existing code works if user types entire word "kittens":
$('#change').text("nothing entered yet") var $typeahead = new array ("kittens","puppies","giraffe","trucks"); $('#query').autocomplete({source: $typeahead, autofocus: true}).change(function() { var text = $(this).val().tolowercase(); switch (text) { case "kittens": $('#change').text("kittens"); break; case "puppies": $('#change').text("puppies"); break; default: $('#change').text("neither kittens nor puppies"); break; } });
but if user takes advantage of autocomplete , arrows down select option "kittens" after typing few letters, nothing happens- because function bound .change, , when .change triggered on #query, there not yet match. ie user has entered "ki" , arrowed down, , not match "kittens".
how can change function isn't triggered until whole word has been entered, either user manually typing "kittens", or user typing "ki" , selecting autocomplete options? put way: options exist other .change detect entry has been made in text box?
.blur key- trigger actions when text box loses focus. means user can either type in whole word "kitten", or begin scrolling down autocorrect list, , trigger function.
Comments
Post a Comment