使jquery自动完成不使用所选项的标签填充输入值

Question

Is there any way to make jquery autocomplete plugin only respond to the "select" callback, not to fill the target input with the label value of the selected item after user selection?

I am trying but still no success, waiting for help...

Regards. Larry

Answer 1

I know that this is an old question but, for people that doesn't want to use the setTimeout function, the solution is to change the property ui.item.value to ""

Code :

$('#ac').autocomplete({
    source : ["hello", "how", "do", "you", "do"],
    select: function(event, ui){
        if (ui.item && ui.item.value){
            ui.item.value="";
        } 
    }
})

Answer 2

Try code below ;)

$('#ac').autocomplete({
    source : ["hello", "how", "do", "you", "do"],
    close: function(event, ui){
          $('#ac').val('');
    }
});

Answer 3

If your source array is an array of objects with "label" and "value" properties, the plugin handles this for you.

See jQuery api for autocomplete :

 $('#autocomplete').autocomplete({ source: [ { label: 'This is a descriptive label' , value: 'Just the value' } ,{ label: '2 is better than one' , value: '2'} ,{ label: 'third times the charm' , value:'Three' } ] }) 

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js"></script> <input type='text' id='autocomplete'> 

SO's code snippet doesn't like it but it works

Answer 4

Here is an even simpler way (using experimentX's code):

$('#ac').autocomplete({
    source : ["hello", "how", "do", "you", "do"],
    select: function(event, ui){
        $('#ac').css('color','white');    
    }
})

Answer 5

DEMO ON JS FIDDLE

$('#ac').autocomplete({
    source : ["hello", "how", "do", "you", "do"],
    select: function(event, ui){
        setTimeout(function (){
          $('#ac').val('');    
        }, 1000)
    }
})