diff --git a/README.md b/README.md index 0a69c7f..92d3181 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,14 @@ -# $.geocomplete() - Version 1.4 +# $.geocomplete() - Version 1.4 forked ## jQuery Geocoding and Places Autocomplete Plugin An advanced jQuery plugin that wraps the Google Maps API's [Geocoding](https://code.google.com/apis/maps/documentation/javascript/geocoding.html) and [Places Autocomplete](https://code.google.com/apis/maps/documentation/javascript/places.html#places_autocomplete) services. You simply provide an input that lets you search for locations with a nice autocomplete dropdown. Optionally add a container to show an interactive map and a form that will be populated with the address details. +### ATTENTION!!! + +This fork has been modified to include the ability to apply multiple address components to a single input, the ability to set the selected option of a select box, support for pre-existing markers and whether to set the marker position on initialization. -View the [annotated source](http://ubilabs.github.com/geocomplete/docs/). +View the original repository [annotated source](https://github.com/ubilabs/geocomplete) + +View the [annotated source](https://github.com/climbak/geocomplete/blob/master/jquery.geocomplete.js). ## Basic Usage @@ -90,10 +95,11 @@ Advanced Example: ```html
- Latitude: - Longitude: - Address: - Country Code: + Latitude: + Longitude: + Full Address: + Street Address: + Country Code:
``` @@ -124,6 +130,8 @@ $("#my_input").geocomplete({ ``` * `map` - Might be a selector, a jQuery object or a DOM element. Default is `false` which shows no map. +* `marker` - Might be a selector, a jQuery object or a DOM element. Default is `false` which creates a new basic marker. +* `initMarker` - Whether to set the position of the marker on map initialization. Default: `true` * `details` - The container that should be populated with data. Defaults to `false` which ignores the setting. * `location` - Location to initialize the map on. Might be an address `string` or an `array` with [latitude, longitude] or a `google.maps.LatLng`object. Default is `false` which shows a blank map. * `bounds` - Whether to snap geocode search to map bounds. Default: `true` if false search globally. Alternatively pass a custom LatLngBounds object diff --git a/jquery.geocomplete.js b/jquery.geocomplete.js index db95882..a05b272 100644 --- a/jquery.geocomplete.js +++ b/jquery.geocomplete.js @@ -36,6 +36,8 @@ bounds: true, country: null, map: false, + marker: false, + initMarker: true, details: false, detailsAttribute: "name", location: false, @@ -119,10 +121,16 @@ }, // Add a marker with the provided `markerOptions` but only - // if the option was set. Additionally it listens for the `dragend` event - // to notify the plugin about changes. + // if the option was set or link to an existing marker instance. + // Additionally it listens for the `dragend` event to notify + // the plugin about changes. initMarker: function(){ if (!this.map){ return; } + if(typeof this.options.marker.setPosition == "function"){ + this.marker = this.options.marker; + return; + } + var options = $.extend(this.options.markerOptions, { map: this.map }); if (options.disabled){ return; } @@ -200,7 +208,7 @@ details = {}; function setDetail(value){ - details[value] = $details.find("[" + attribute + "=" + value + "]"); + details[value] = $details.find("[" + attribute + "^=" + value + "]"); } $.each(componentTypes, function(index, key){ @@ -239,7 +247,7 @@ if (latLng){ if (this.map){ this.map.setCenter(latLng); } - if (this.marker){ this.marker.setPosition(latLng); } + if (this.marker && this.options.initMarker){ this.marker.setPosition(latLng); } } }, @@ -363,7 +371,25 @@ // Set the values for all details. $.each(this.details, $.proxy(function(key, $detail){ - var value = data[key]; + $detail = $detail.first(); + + // build the value for single or mutliple address component types + var value; + var count = 0; + var comps = $detail.attr('data-geo'); + if(comps !== undefined){ + $.each(comps.replace(/\s+/g, ' ').split(" "), function(){ + var current = data[this.toString()]; + if(count++ === 0) + value = current; + else + value += " " + current; + }); + } + else + value = data[key]; + + // Set the values for all details. this.setDetail($detail, value); }, this)); @@ -382,8 +408,14 @@ } if ($element.is(":input")){ - $element.val(value); - } else { + if($element.is("select")){ + $element.find("option").filter(function(){ + return ( ($(this).val() == value) || ($(this).text() == value) ) + }).prop('selected', true); + } + else + $element.val(value); + } else { $element.text(value); } },