Question

I have a combo box and drop down items are coming like:

<select name="combo1" id="combo1">
  <option value="a">A</option>
  <option value="b">B</option>
</select>

But i want that this above combo box should behave like a textbox when user has not put mouse cursor on that combo box. But when user will put the cursor on that textbox, immediately that textbox will behave like a combo box(like above combo) and drop down items will come. How is it possible? Any help

Answer 1

You can use the following code to get the autocomplete onfocus of input tag:

html code:

<div class="demo">  
    <div class="ui-widget">    
    <label for="tags">Tags: </label>    
    <input id="tags">
    </div>
</div>

Jquery:

$(function() {       
    var availableTags = [       
        "ActionScript",        
        "AppleScript",      
        "Asp",           
        "BASIC",          
        "C",        
        "C++",          
        "Clojure",    
        "COBOL",   
        "ColdFusion",    
        "Erlang",       
        "Fortran",    
        "Groovy",     
        "Haskell",  
        "Java",       
        "JavaScript",      
        "Lisp",        
        "Perl",         
        "PHP",        
        "Python",      
        "Ruby",         
        "Scala",        
        "Scheme"         ];     
    $( "#tags" ).autocomplete({          
        source: availableTags,
        minLength: 0
    }).focus(function(){            
            $(this).trigger('keydown.autocomplete');
        });
});

For Reference:

http://jsfiddle.net/Tpz2X/

Hope this helps you 🙂