在提交表单之前执行客户端地理编码不起作用答案

【问题标题】：Implementation of client side geocoding before form submission doesn't work在提交表单之前执行客户端地理编码不起作用
【发布时间】：2016-05-02 19:23:39
【问题描述】：

在我的 Rails 应用程序中，我希望用户在输入字段中输入地址，然后应用程序应对其进行地理编码并在服务器上发送坐标参数。

我的计算纬度和经度有隐藏字段。我尝试使用 JQuery，这样当用户提交表单时，它会阻止默认操作，执行地理编码逻辑，填充隐藏的输入字段，然后实际提交表单。

好吧，问题是我的 javascript 代码出了点问题，因为地理编码不起作用。

这是我的代码：

views/locals/_form.html.erb

<%= form_for @local  do |f| %>
    <%= f.label :address %><br>
    <%= f.text_field :address, placeholder: "City, State or Postal Code"     %>

    <%= f.hidden_field :latitude %>
    <%= f.hidden_field :longitude %>
    <%= f.submit "Add local!", id: "submit_button" %>
<% end %>

assets/javascript/locals.js：

$( document ).ready(function() {
    $(function() {
    $('#new_local').click(function(e){
        e.preventDefault();
        var address_to_geocode = document.getElementById('local_address').value();
        var geocoder = new google.maps.Geocoder();
        geocoder.geocode({address: address_to_geocode },     function(results, status) {

            var coordinates = results[0].geometry.location;
            $("#local_latitude").val( coordinates.lat() );
            $("#local_longitude").val( coordinates.lng() );

        });
        $('#new_local').submit();
        })
    })
});

我的 API 密钥包含在 application.html.erb 中。
地点控制器中允许经纬度。

有没有人看出哪里错了？

【问题讨论】：

你有什么错误吗？此外，您似乎通过 id #new_local 引用了某些内容（可能您想要提交按钮），而模板中的按钮获取 id #submit_button。
new_local 是一个表单 ID
那么您可能应该将您的地理编码代码附加到submit 事件，不是吗？你不点击表格...
对了但是还是..纬度和经度都是0..

标签： javascript jquery ruby-on-rails google-api geocoding

【解决方案1】：

也许你应该试试geocomplete 或者，如果您想将地址保存到数据库，例如 lat/lon 使用 geocoder gem

geocoded_by :full_street_address # can also be an IP address after_validation :geocode # auto-fetch coordinates

【讨论】：

我对服务器端地理编码不感兴趣