0

I am using this plugin in Rails but still have a problem with error in title.

Definition of script:

script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=MY_API_KEY&libraries=places&sensor=false>

Input text field:

<%= f.text_field :place, id: "cities", class: "form-control cities", type: "text" %>

Javascript load:

$("cities").geocomplete();
$.fn.geocomplete("cities");

I have done everything as described on GitHub but still cannot get it works. If I use $("#cities").geocomplete(); the error is the same.

Please, can somebody help me?

Sravan
  • 18,467
  • 3
  • 30
  • 54
Boomerange
  • 616
  • 1
  • 10
  • 18
  • Is this a typo `$("cities")` and `fn.geocomplete("cities");`? – Roman Kiselenko Sep 23 '16 at 06:22
  • @Зелёный What do you mean by that? On the GitHub of Geocomplete its written that first row is input (search in autocomplete) and second row gives you search result back: http://ubilabs.github.io/geocomplete/ In Basic usage. – Boomerange Sep 23 '16 at 06:37

1 Answers1

1

You should also add the jquery.geocomplete.js script inorder to make the geo-complete work.

Scripts:

<script src="http://maps.googleapis.com/maps/api/js?libraries=places"></script>
<script src="jquery.geocomplete.js"></script>

You should load these two scripts, then call the function.

$("#cities").geocomplete();  // Option 1: Call on element.

Here is the reference

Sravan
  • 18,467
  • 3
  • 30
  • 54
  • Actually I had geocomplete.js in application.js://= require geocomplete I am using geocomplete gem, but the error is still the same. – Boomerange Sep 23 '16 at 06:46
  • there is no need of two functions, you can call only one, `$("#cities").geocomplete();` – Sravan Sep 23 '16 at 06:55
  • also see the page source, and check if geocomplete js is loaded – Sravan Sep 23 '16 at 06:55
  • Ok, there is a progress. Error is gone without second row, I can see Enter a location in the field, but autocomplete still doesn't work. – Boomerange Sep 23 '16 at 11:56
  • once type it in the browser console and check. `$("#cities").geocomplete(); ` – Sravan Sep 23 '16 at 12:38
  • I have found out that it works. But not in Bootstrap modal. So thank you for your answer :) Now I think I have to set z-index of that field. – Boomerange Sep 23 '16 at 12:53