jquery autocomplete multislect backspace issue -


i using jquery autocomplete enable multiple values single field. works fine until use backspace in input field. when user make 1 or more selection each time id of selected filed added 1 hidden field.when user remove 1 or more selections using backspace not able capture event using autocomplete , because of not able modify value of hidden field.

could please me out. please refer below link more details.

http://jsfiddle.net/z26yv/

html:

<label>teams:</label> <input type="text" id="teams" /> <br /> <br /> <label>team ids:</label> <input id="team_ids" /> 

script:

$(function() {             var availabletags = [                 {label: "choice1", value: "choice1", db: 1},                 {label: "choice2", value: "choice2", db: 2},                 {label: "choice3", value: "choice3", db: 3},                 {label: "choice4", value: "choice4", db: 4},                 {label: "choice5", value: "choice5", db: 5},                 {label: "choice6", value: "choice6", db: 6},                 {label: "different text", value: "different text", db: 7},             ];              function split(val) {                 return val.split(/,\s*/);             }              function extractlast(term) {                 return split(term).pop();             }              $("#teams")             //don't navigate away field on tab when selecting item             .bind("keydown", function(event) {                 if (event.keycode === $.ui.keycode.tab && $(this).data("ui-autocomplete").menu.active) {                     event.preventdefault();                 }             })             .autocomplete({                 minlength: 0,                 source: function(request, response) {                     //delegate autocomplete, extract last term                     response($.ui.autocomplete.filter(availabletags, extractlast(request.term)));                 },                 focus: function() {                     //prevent value inserted on focus                     return false;                 },                 select: function(event, ui) {                     var terms = split(this.value);                     //remove current input                     terms.pop();                     //add selected item                     terms.push(ui.item.value);                     //add placeholder comma-and-space @ end                     terms.push("");                     this.value = terms.join(", ");                      $('#team_ids').val($('#team_ids').val() + "," + ui.item.db);                     return false;                 }             });         }); 


Comments

Popular posts from this blog

javascript - JS causing window size to be bigger than necessary - Dropdown bug -

How to mention the localhost in android -

php - Calling a template part from a post -