CODEWITHSUNDEEP
jquerywordpressgoogle-mapsmaps
Patrick Heiloo
Patrick Heiloo

Reputation: 45

Google Maps LatLong Picker - latlong in 1 field

I have a question about a jQuery plugin I use for a custom Wordpress shortcode. The plugin is a searchform for Google Maps with LatLong as output.

Link to plugin: http://www.wimagguc.com/projects/jquery-latitude-longitude-picker-gmaps/ I use the example code from: "Editable and selectable Latitude/Longitude values".

The latitude and longitude are both outputted as hidden inputs. I want the latitude AND longitude outputted in 1 hidden input.

Example output:

<input type="text" class="gllpLatitude" value="52.372086">
<input type="text" class="gllpLongitude" value="4.898437">

Desired output:

<input type="text" class="LatLong" value="52.372086,4.898437">

The question is: how?!

Here is the code of the plugin: http://www.wimagguc.com/projects/jquery-latitude-longitude-picker-gmaps/js/jquery-gmaps-latlon-picker.js

Upvotes: 1

Views: 1924

Answers (1)

keune
keune

Reputation: 5795

You could add another hidden field for this. Since a location_changed event is firing whenever the marker is moved, you could update this value easily. You would also need to set this value on initialization, so if the user submits the from without changing the marker position, latLng value will still be set correctly. 

$(document).bind("location_changed", function(event, object) {
    updateLatLng($(this));
});

$(".gllpLatlonPicker").each(function() {
    (new GMapsLatLonPicker()).init( $(this) );
    updateLatLng($(this));
});

function updateLatLng(object) {
    var lat = $(object).find('.gllpLatitude').val();
    var lng = $(object).find('.gllpLongitude').val();
    var latLng = lat + ',' + lng;
    $(object).find('.gllpLatLong').val(latLng);
}

Working fiddle here

Upvotes: 4

Related Questions