CODEWITHSUNDEEP
jqueryjquery-uiautocomplete
Arnoud Kooi
Arnoud Kooi

Reputation: 1767

jQuery UI Autocomplete value after mouse click is old value

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.

Upvotes: 3

Views: 5323

Answers (2)

Jon
Jon

Reputation: 13002

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

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

Upvotes: 2

jk.
jk.

Reputation: 14435

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/

Upvotes: 4

Related Questions