Jquery auto-complete displaying all data -


i have static json file contains data in json format. now, have implemented auto-complete functionality using jquery plugin. problem auto-complete displaying results including unnecessary ones. following javascript code,

 $('input#searchbox').autocomplete({         source: function( request, response ) {             $.ajax({                 url: "${pagecontext.request.contextpath}/products_cache.json",                 datatype: "json",                 data: {term: request.term},                 success: function(data) {                     response($.map(data.products, function(item) {                         return {                             value: item.product,                             label: item.product,                             key: item.id                         };                     }));                 }             });         },         minlength:2,         select: function(event, ui) {             $("#searchbox").val(ui.item.key);         },         open: function() {             $( ).removeclass( "ui-corner-all" ).addclass( "ui-corner-top" );         },         close: function() {             $( ).removeclass( "ui-corner-top" ).addclass( "ui-corner-all" );         }     }); 

my json file contains data in following format,

   { "products": [     {         "id":"1",         "product": "product1"     },     {     "id":"2",         "product": "product2"     },     {     "id":"3",         "product": "product3"     },     {     "id":"4",         "product": "product4"     },     {     "id":"5",         "product": "product5"     } ] 

}

ideally, when giving input ab, autocomplete should not provide suggestion. how filter out unwanted values?

i don't know ajax based jquery. tried upon code. if got error, ignore answer.

var productarray = []; $('input#searchbox').autocomplete({     source: function(request, response) {         $.ajax({             url: "${pagecontext.request.contextpath}/products_cache.json",             datatype: "json",             data: { term: request.term },             success: function(data) {                 $.each(data, function(key, value) {                     productarray[key] = value.product;                  });                 //  \\b show each match letter in each word of list                 //  ^ show each match letter in whole word of list                 var matcher = new regexp("^" + $.ui.autocomplete.escaperegex(request.term), "i");                 var = $.grep(productarray, function(item, index) {                     return matcher.test(item);                 });                 response(a);             }         });     },     minlength: 2,     select: function(event, ui) {         $("#searchbox").val(ui.item.key);     },     open: function() {         $(this).removeclass("ui-corner-all").addclass("ui-corner-top");     },     close: function() {         $(this).removeclass("ui-corner-top").addclass("ui-corner-all");     } }); 

this how use auto complete. jquery code (sample)...

click here example

==== jquery      $(document).ready(function() {         getlocalitylist();     });      function getlocalitylist() {         var localityarray = ["win day", "win heart of", "win heart of someone"];         $("#tags").autocomplete({             minlength: 1,             source: function(req, responsefn) {                 //  \\b show each match letter in each word of list                 //  ^ show each match letter in whole word of list                 var matcher = new regexp("\\b" + $.ui.autocomplete.escaperegex(req.term), "i");                 var = $.grep(localityarray, function(item, index) {                     return matcher.test(item);                 });                 responsefn(a);             }         });     }  ==== html  <body>         <div>             <label for="tags">                 search :              </label>             <input type="text" id="tags">         </div> </body> 

Comments

Popular posts from this blog

jquery - How can I dynamically add a browser tab? -

node.js - Getting the socket id,user id pair of a logged in user(s) -

keyboard - C++ GetAsyncKeyState alternative -