Demo of Autocomplete option object in JQuery UI



List of option name value by using object .

source: [ "PHP", "JQuery", "JavaScript", "HTML", "ASP", "Perl", "MySQL","Access","Excel","Dot Net" ],

HTML

<input id=auto_c>
<div id=d1></div>

jquery

<script>
$(document).ready(function() {
////////////////
$( "#auto_c" ).autocomplete({
  source: [ "PHP", "JQuery", "JavaScript", "HTML", "ASP", "Perl", "MySQL","Access","Excel","Dot Net" ],
  minLength:0,
  position: { my : "right top", at: "right bottom" }
});
//////////////////
var option_obj = $( "#auto_c" ).autocomplete( "option" );
$('#d1').html( "autoFocus : "  + option_obj.autoFocus);
$('#d1').append( "<br>delay : "  + option_obj.delay);
$('#d1').append( "<br>disabled : "  + option_obj.disabled);
$('#d1').append( "<br>minLength : "  + option_obj.minLength);
$('#d1').append( "<br>position my : "  + option_obj.position.my + " , position at : "  + option_obj.position.at);
$('#d1').append( "<br>source : "  + option_obj.source);
///////////////
$("input:radio[name=r1]").click(function() {
var sel=$(this).val()
var val=	$( "#auto_c" ).autocomplete("option", sel );
$('#d1').html( sel + " : " + val);
})
////////
})