jQuery Geocomplete Examples

Default Data Attributes
        $("#txtAddress1").geocomplete({
          formId: "#myForm"
        });

        <div id="myForm">
          <input id="txtAddress1" data-geocomplete="street address" />
          <select data-geocomplete="country"></select>
          ...
        </div>
      
Custom Data Attributes
        $("#txtAddress2").geocomplete({
          formId: "#myForm2"
          addressDataKey: "geo-address"
        });

        <div id="myForm2">
          <input id="txtAddress2" data-geo-address="street address" />
          <select data-geo-address="country"></select>
          ...
        </div>
      
Appended To Parent
        $("#txtAddress3").geocomplete({
          appendToParent: true
        });
      
Not Appended To Parent
        $("#txtAddress4").geocomplete({
          appendToParent: false
        });
      
Strict Bounds
        $("#txtAddress5").geocomplete({
          geolocate    : true,
          strictBounds : true
        });
      
Callbacks
        $("#txtAddress6").geocomplete({
          onChange: function(name, result) {
            console.log(name, result)
          },
          onNoResult: function(name) {
            console.log("Could not find a result for " + name)
          }
        });
      
Google Map
        var myMap = new google.maps.Map(document.getElementById("myMap"), {
          center : { lat: 37.5, lng: -120 },
          zoom   : 6
        });

        $("#txtAddress7").geocomplete({
          map: myMap
        });