jQuery autocomplete trigger button on select

Question

I'm using Jorn Zaefferer's Autocomplete query plugin, http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/

Everything seems to be working as it should: I type in some text and I get the suggestions. When the suggestions pop up, I have to click on one: that triggers the textbox being filled with the suggestion and hides all the other ones. Then I have to click on the Search button (or use the Enter button instead of clicking).

Is it possible to avoid having to click (or press Enter) twice ? Are there any options that can be set so that selecting a suggestion not only fills the textbox but also triggers the click event on the button ?

I tried using the select option, like so:

    $('#txtSearch').autocomplete({
        source: '/dictionnaire/autocomplete',
        select: function (event, item)
        {
            alert("testing");
        },
        width: 358
    });

... but the alert doesn't show up. Any suggestions ?

You should really be using the Autocomplete function that comes as part of jQuery UI. The one you linked to is no longer supported, and the one in jQuery UI is its successor, as stated at the top of the page you linked to. — James Allardice
– James Allardice, Commented Jun 20, 2011 at 13:31
As far as I could tell, jQuery UI Autocomplete has the same behavior. I considered switching, but ran into problems when trying to alternate the rows' css. The 'open' event didn't trigger for some reason. — Diana Ionita
– Diana Ionita, Commented Jun 20, 2011 at 13:35
have you followed the guide for upgrading? The width option for example is deprecated. In any case you should use the newest plugin — Nicola Peluchetti
– Nicola Peluchetti, Commented Jun 20, 2011 at 13:39
@Nicola Peluchetti yes I did, I had removed the width statement. If I can't sort it out with this plugin, I will switch to the newest, but I foresee more headaches there. — Diana Ionita
– Diana Ionita, Commented Jun 20, 2011 at 13:53

Nicola Peluchetti · Accepted Answer · 2011-06-20 13:31:23Z

4

I think you should use jquery UI autocomplete instead of that since that plugin is deprecated in favor of the other.

Then i would do something like you did:

$('#txtSearch').autocomplete({
    source: '/dictionnaire/autocomplete',
    select: function (event, item)
    {
        if (event.keyCode == 13){
            $('#idOfYourForm').submit()
        }
    }
});

answered Jun 20, 2011 at 13:31

Nicola Peluchetti

77k32 gold badges150 silver badges197 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Diana Ionita Over a year ago

As I said in my original post, the select event isn't triggered.

Nicola Peluchetti Over a year ago

That's because the select event is not present in your plugin, or at least it's not in the documentation: docs.jquery.com/Plugins/Autocomplete/… and that is why i suggest you oass to the other

Diana Ionita Over a year ago

Awesome, that was it, I upgraded. And I even found out why my events weren't firing. Thank you very much !

Collectives™ on Stack Overflow

jQuery autocomplete trigger button on select

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related