jQuery UI Autocomplete value after mouse click is old value

Question

I'm using the jQuery UI Autocomplete widget. I need to use the selected text for further processing, direct after change or select.

But when a user clicks the suggested value, the typed value gets passed.

$( "#autocomplete" ).autocomplete({
source: function( req, resp ) {
    $.post( "/echo/json/", {
        json: '["Test1", "Test2", "Test3", "Test4", "Test5"]',
        delay: 1
    }, function(data) {
        resp( data );
    }, "JSON" );
},
select: function (event, ui) { alert($(this).val())}
});

An example at this fiddle: (try typing "tes" and select a suggestion by mouse)

http://jsfiddle.net/M3Yur/

i need to use the input value. a change events uses the input value, it needs to work in both cases when a autocomplete item is selected, but also when just a value is typed so the alert is just for the example.

Any way to get around this?

EDIT: i ended up using: $(this).val(ui.item.value).val(); this solutions always gets the intended value after a change event.

jk. · Accepted Answer · 2011-06-10 00:20:14Z

4

Change this:

select: function (event, ui) { alert($(this).val())}

To this:

select: function (event, ui) {alert(ui.item.value);}

New fiddle: http://jsfiddle.net/M3Yur/4/

answered Jun 10, 2011 at 0:20

jk.

14.4k4 gold badges45 silver badges58 bronze badges

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

3 Comments

Arnoud Kooi Over a year ago

Thanx Jon/Jen, The alert is a example, i need to use the input value. a change events uses the input value, it needs to work in both cases when a autocomplete item is selected, but also when just a value is typed

jk. Over a year ago

You have both values. Maybe if we knew when the change event fires??

Arnoud Kooi Over a year ago

The suggestion did point me in the direction that works for me: $(this).val(ui.item.value).val(); works for me

Jon · Accepted Answer · 2011-06-10 00:21:30Z

2

The ui argument contains the information you're looking for:

select: function (event, ui) { alert(ui.item.value); }

answered Jun 10, 2011 at 0:21

Jon

13.1k4 gold badges34 silver badges44 bronze badges

Collectives™ on Stack Overflow

jQuery UI Autocomplete value after mouse click is old value

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related