Javascript 提交表格前的地理位置

Javascript 提交表格前的地理位置,javascript,ruby-on-rails,ajax,Javascript,Ruby On Rails,Ajax,我有一张表格 <%= form_for @tree, :html => {:class => "well"} do |f| %> <p> <div class="field"> <%= f.text_field :address, :class => 'tree-address' %> </div> </p> <p> <div class="actions">

我有一张表格

<%= form_for @tree, :html => {:class => "well"} do |f| %>
<p>
  <div class="field">
    <%= f.text_field :address, :class => 'tree-address' %>
  </div>
</p> 
<p>
  <div class="actions">
    <%= f.submit :class => "submit", id: "new-tree" %>
  </div>
</p>

听起来你真正想要的是位置自动完成。请参阅此处的详细信息:您是否需要获取下拉列表中选定位置的所有相关地理数据…或其他信息…请描述?
function createTree(){
  $address = $('.tree-address').val();

  $.ajax({
    url: "/trees",
    method: 'POST',
    dataType: 'json',
    data: { tree:{
      address:$address, 
    }}
  });
}

function codeAddress() {
  console.log($('address').val());
  geocoder = new google.maps.Geocoder();
  var address = document.getElementById('address').value;
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      console.log(results[0].geometry.location)
      var latitude = results[0].geometry.location.A;
      var longitude = results[0].geometry.location.F;
    } else {
      console.log('Geocode was not successful for the following reason: ' + status);
    }
  });
}

$(document).ready(function(){

   $('#new-tree').on('submit', function(e){
     e.preventDefault();
     createTree();
   });

  $('#add-tree').on('click', function(){
    console.log("add-tree clicked");
    $('#tree-form').toggle();
  });

});