Trying to use a form to input marker with javascript into gmaps4rails

Question

I keep getting Uncaught TypeError: Cannot call method 'geocode' of undefined. address is showing up whatever I type in on my form, but the geocodeAddress function isn't adding a new marker like I want it to.

Here is the form

%form.center{:action => "", :method => "GET", :name => "myform"}
    .large-4.columns
      %label.right.inline{:for => "right-label"} Enter your Location
    .large-8.columns
      .row.collapse  
        .small-10.columns
          %input#right-label{:placeholder => "e.g 131 Bobby St Orlando Fl", :name => "inputbox", :type => "text", :value => ""}
        .small-2.columns
          %input{ :name => "button1", :class => "button postfix", :value => "Find", :onClick => "geocodeAddress(this.form)"}

Javascript

var handler = Gmaps.build('Google', { markers: { maxRandomDistance: null }, builders: { Marker: InfoBoxBuilder} });
  handler.buildMap({ internal: {id: 'geolocation'} }, function(){
    if(navigator.geolocation)
      navigator.geolocation.getCurrentPosition(displayOnMap);
  });

  function displayOnMap(position){
    var marker = handler.addMarker({
      lat: position.coords.latitude,
      lng: position.coords.longitude,
      infowindow: 'You!',
      picture: {
                    "url": "https://addons.cdn.mozilla.net/img/uploads/addon_icons/13/13028-64.png",
                    "width":  36,
                    "height": 36
                },
    });
    handler.map.centerOn(marker);
    handler.getMap().setZoom(17);
    markers = handler.addMarkers(#{raw @hash.to_json});
  };

var geocoder;

function initialize()
{
    geocoder = new google.maps.Geocoder();
}

function geocodeAddress(form){
    address =form.inputbox.value;

    geocoder.geocode( {'address': address}, function(results, status) //this is where it is showing the error
    { 
      if ( status == google.maps.GeocoderStatus.OK)
      {
        handler.map.centerOn(results[0].geometry.location);
        marker = handler.addMarker(results[0].geometry.location);
      }
      else
      {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
}

any help as to why this is happening would be appreciated.

Answer 1

You have a initialize function setting the geocoder, but... you never call it.

So the geocoder is undefined, boom.