Geocomplete在Rails 5中不起作用

时间:2017-06-09 23:07:10

标签: javascript jquery ruby-on-rails ruby geocomplete

我在Rails proyect中使用geocomplete时遇到问题,基本上我想使用地理填充自动填充一个地方,但是表单拒绝工作,我尝试使用不太复杂的地理完整功能,但似乎没有任何工作正常。< / p>

顺便说一句,我正在使用“geocomplete_rails”宝石。

我复制粘贴的代码来自其中一个地理填充示例,更短一些:

<div id="my_input">

  <input id="geocomplete" type="text" placeholder="Type in an address" 
  autocomplete="off">
  <input class="find_me" type="button" value="Encuentra">
  <div id="my_map">

  </div>

  <div id="my_form">

  </div>

</div>

这里是geo.js

$("#geocomplete").click(function(){
  console.log("Go");
  $("input").trigger("geocode");
});

$("#my_input").geocomplete({
  map: "#my_mappu",
  mapOptions: {
    zoom: 10
  },
  markerOptions: {
    draggable: true
  },
  details: "#my_form"
});

我的代码中已经有googlemaps api,在我的html头部中

<script 
  src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAwAw8El2ksHEry1EmoX6LIoZJsFIPXmdc&libraries=places&"
  async defer>
</script>

这是我需要的js文件

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require bootstrap-sprockets
//= require cocoon
//= require turbolinks
//= require dropzone
//= require timepicker
//= require datepicker
//= require jquery-ui
//= require geocomplete
//= require geo
//= require_tree .

对我来说最奇怪的是每当我在“$(”#geocomplete“)之外请求提醒时。点击(function(){”它有效,但点击选择器什么都不做。有关为什么的任何想法这不起作用?

1 个答案:

答案 0 :(得分:1)

您的HTML

<div id="my_input">

  <input id="geocomplete" type="text" placeholder="Type in an address" 

...

因此,您输入的ID为geocomplete,而不是my_input

而不是打电话

$("#my_input").geocomplete({ ...

你应该致电

$(document).ready(function() {

  $("#geocomplete").geocomplete({
    ...

除此之外,你想把这一行

<script src="https://maps.googleapis.com/maps/api/js?key=xxx&librari‌​es=places&" async defer> </script>

位于您头部的顶部,就在<title>部分

之后

为了帮助未来的人们,我用一个有效的rails应用程序创建了一个开源非常简单的github仓库=&gt; https://github.com/Poilon/super-simple-gplaces