i am working with jquery atoplete and want to search the suggestion on click like google youtube. but it's not working. here is html code

<ul class="ui-autoplete ui-front ui-menu ui-widget ui-widget-content ui-corner-all" id="ui-id-1" tabindex="0" style="display: none; top: 488px; left: 248px; width: 542px;">
    <li class="ui-menu-item" role="presentation">
        <a id="ui-id-6" class="ui-corner-all" tabindex="-1">Activity</a>
    </li>
    <li class="ui-menu-item" role="presentation">
        <a id="ui-id-7" class="ui-corner-all" tabindex="-1">Apply online</a>
    </li>
</ul>

and jquery is here

    $( "#site-search-query" ).autoplete({
    source: function(request, response) {
    var results = $.ui.autoplete.filter(res, request.term);
    response(results.slice(0, 4));
}

any suggestion regarding this ?

i am working with jquery atoplete and want to search the suggestion on click like google youtube. but it's not working. here is html code

<ul class="ui-autoplete ui-front ui-menu ui-widget ui-widget-content ui-corner-all" id="ui-id-1" tabindex="0" style="display: none; top: 488px; left: 248px; width: 542px;">
    <li class="ui-menu-item" role="presentation">
        <a id="ui-id-6" class="ui-corner-all" tabindex="-1">Activity</a>
    </li>
    <li class="ui-menu-item" role="presentation">
        <a id="ui-id-7" class="ui-corner-all" tabindex="-1">Apply online</a>
    </li>
</ul>

and jquery is here

    $( "#site-search-query" ).autoplete({
    source: function(request, response) {
    var results = $.ui.autoplete.filter(res, request.term);
    response(results.slice(0, 4));
}

any suggestion regarding this ?

• javascript
• jquery
• html
• css
• jquery-autoplete

2 Answers 2

In the click handler call the search-method of autoplete - You need to set the minLength-option to 0 to make it work

$("#site-search-query").autoplete({
    source: function (request, response) {
        var results = $.ui.autoplete.filter(res, request.term);
        response(results.slice(0, 4));
    },
    minLength: 0
}).click(function () {
    $(this).autoplete('search')
});

Demo: Fiddle

Try this:

$( "#site-search-query" ).autoplete({
    source: function(request, response) {
    var results = $.ui.autoplete.filter(res, request.term);
    response(results.slice(0, 4));
    },
    select: function( event, ui ) {
    //Your search function
    }
})