$(document).ready(function() {
  $("#city_name").bind('focus',function(){
    var ID = $('#state_name').val();
    $.ajax({
      type: "GET",
      url: "bg/load_data_find_ext.php",
      data: "type=city_from_state_name&id="+ID,
      success: function(msg){
      //
      }
    });
  });
    
  var states = ['Alabama','Alaska','Arizona','Arkansas','California','Colorado','Connecticut','Delaware','District of Columbia','Florida','Georgia','Hawaii','Idaho','Illinois','Indiana','Iowa','Kansas','Kentucky','Louisiana','Maine','Maryland','Massachusetts','Michigan','Minnesota','Mississippi','Missouri','Montana','Nebraska','Nevada','New Hampshire','New Jersey','New Mexico','New York','North Carolina','North Dakota','Ohio','Oklahoma','Oregon','Pennsylvania','Rhode Island','South Carolina','South Dakota','Tennessee','Texas','Utah','Vermont','Virginia','Washington','Washington DC','West Virginia','Wisconsin','Wyoming'];
  /* Auto Complete for states*/
  $( "#state_name" ).autocomplete({
    source: states,
    minLength: 2,
    open: function(event, ui) {
      var position = $( "#state_name" ).position();
      var topPosition = (parseInt(position.top, 10) - parseInt($('.ui-autocomplete:eq(0)').css('height'), 10) - 6)
      $('.ui-autocomplete').css('top', topPosition+'px');
      //console.log(position);
      //console.log(topPosition);
      //console.log($('.ui-autocomplete:eq(0)').css('height'));
    },
    select: function( event, ui ) {
    //
    }
  });

  /* Auto Complete for cities*/
  $( "#city_name" ).autocomplete({
    source: "lib/load_cities.php",
    minLength: 2,
    open: function(event, ui) {
      var position2 = $( "#city_name" ).position();
      var topPosition2 = (parseInt(position2.top, 10) - parseInt($('.ui-autocomplete:eq(1)').css('height'), 10)-6);
      $('.ui-autocomplete').css('top', topPosition2+'px');
    },
    select: function( event, ui ) {
    //
    }
  });
});