【问题标题】:Save Response Data from Google Places Autocomplete API保存来自 Google Places Autocomplete API 的响应数据
【发布时间】:2014-03-31 23:01:58
【问题描述】:

我在“新”工作视图中有以下代码:

<input type="text" id="address" style="width: 500px;"></input>

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&libraries=places"></script>
<script>
  var autocomplete = new google.maps.places.Autocomplete($("#address")[0], {});

  google.maps.event.addListener(autocomplete, 'place_changed', function() {
    var place = autocomplete.getPlace();
    console.log(place.address_components);
  });
</script>

从自动完成输入字段中选择地址时,我的create 操作应该如何保存生成的地址字段?我想我必须找到一种方法来用响应填充我的其他表单字段。另外,知道为什么postal_code 没有显示在结果中(但国家/地区显示)?

我的表单视图如下:

<%= form_for(@job) do |f| %>
  <% if @job.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@job.errors.count, "error") %> prohibited this job from being saved:</h2>

      <ul>
      <% @job.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.label :customer %><br>
    <%= f.text_field :customer %>
  </div>
  <div class="field">
    <%= f.label :address %><br>
    <%= f.text_field :address %>
  </div>
  <div class="field">
    <%= f.label :city %><br>
    <%= f.text_field :city %>
  </div>
  <div class="field">
    <%= f.label :state %><br>
    <%= f.text_field :state %>
  </div>
  <div class="field">
    <%= f.label :postal_code %><br>
    <%= f.text_field :postal_code %>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

【问题讨论】:

    标签: javascript ruby-on-rails google-maps google-maps-api-3 ruby-on-rails-4


    【解决方案1】:

    看起来这个页面回答了我的问题:

    https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform

    从那里,我可以使用基本的create 操作提交填写好的表单。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-12-14
      • 1970-01-01
      • 2016-12-17
      • 1970-01-01
      • 2022-06-19
      • 1970-01-01
      • 2018-11-09
      • 2017-01-23
      相关资源
      最近更新 更多