$('input[name=search1]').autoComplete();
/** * Button code for above example */ // Add enabling feature (disable to begin with) $('input[name=enable-1]').attr('disabled', 'true').click(function(){ $('input[name=search1]').autoComplete(); $('input[name=destroy-1]').attr('disabled', false); $(this).attr('disabled', 'true'); }); // Add disabling feature $('input[name=destroy-1]').click(function(){ $('input[name=search1]').autoComplete('destroy'); $('input[name=enable-1]').attr('disabled', false); $(this).attr('disabled', 'true'); });
$('input[name=search2]').autoComplete({ preventEnterSubmit: true, onSelect: function(data, $li){ alert('You have selected ' + data.value); } });
$('input[name=search3]').autoComplete({ ajax: 'ajax2.php', postData: { hook1: 'Do something on hook1', hook2: 1942, hook3: 'Do something with hook3' } });
// Auto-complete using metadata and maxiumum requests $('input[name=search4]').autoComplete({ onMaxRequest: function(val){ $(this).css('background-color', 'red'); alert('Sorry, but you have used up the maximum number of reqests allowed, and ' + val + ' was not processed'); } }); // Clear requests and remove red background $('input[name=search4-submit]').click(function(){ $('input[name=search4]').autoComplete('flush').css('background-color', 'white').val('').focus(); }); <input type='text' name='search4' style='width:300px;' class='someclass {minChars: 2, maxRequests: 10}' />
// Auto-complete with trigger $('#input-c').autoComplete(); // Trigger full 'c' list $('#submit-c').click(function(){ $('#input-c').autoComplete('button.ajax', {all:true, letter:'c'}, 'ALL_LETTER_C_REQUESTS'); }); // Trigger full 'd' list $('#submit-d').click(function(){ $('#input-c').autoComplete('button.ajax', {all:true, letter:'d'}, 'ALL_LETTER_D_REQUESTS'); }); // Clear just the cache, not the # of requests $('#submit-flush').click(function(){ $('#input-c').autoComplete('flush', true); });
// Autocomplete on User Supplied data $('input[name=search6]').autoComplete({ dataSupply: ['jane', 'john', 'doe', 'amy', 'alice', 'louis', 'liz', {value: 'mark'}, {value: 'merideth', display: 'Merideth Johnson'}] }); // Trigger whole list $('#search6').click(function(){ $('input[name=search6]').autoComplete('button.supply'); });