If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Passing javascript variable to form.

Hi there everyone,

I'm building a membermap system and have run into a bit of a hurdle. I've created a form for the user to submit their location and the page is converting the human readable location into a lat/long string. I need that lat/long value to submit in a form, but I don't know how to do this.

<script type="text/javascript">
//Declare the variable that will store the geocode object
var geocoder;
var map;
function initialize() {
//Set the geocoder variable equal to an instance of the google maps geocoder object as new google.maps.Geocoder()
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(42.095287, -79.3185139);
var myOptions = {
zoom: 2,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
}
//Add a second function to your javascript code, call it codeAddress. It will not have any values passed to it.
function codeAddress() {
//The first line of the function should use getElementById to get the address from the text box and place it
//into a variable we'll call sAddress.
var sAddress = document.getElementById("inputTextAddress").value;
//Call the geocode method of the geocoder object, this will take two passed in parameters. The first is
//the GeocoderRequest, this says what kind of request is being made and what the request value is.
//The second is the callback function that will be used to process the results.
geocoder.geocode( { 'address': sAddress}, function(results, status) {
//The callback function should first check the status value of the callback function. Use an IF statement
//to test the result, check to see if the status equal google.maps.GeocoderStatus.OK. Also add an
//ELSE clause to the if statement as well.
if (status == google.maps.GeocoderStatus.OK) {
//If the status equals OK, call the setCenter method of the map object variable. You will pass this
//method the results first geometry location.
map.setCenter(results[0].geometry.location);
//Next use the same result geometry location to add a map marker to the map object variable. Create a new
//variable, we'll call it oMarker, it will be created as a new google.maps.Marker. The new method take two
//parmaters, the first is the map object that you're adding the marker to, and the second is the
//position to place the marker which is again the first results geometry location.
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
//Finally we're going to add an alert message to the ELSE to let the user know that the Geocode didn't
//work like it should have. You can use the status to give a bit more information rather than just saying
//that it didn't work.
alert("Geocode was not successful for the following reason: " + status);
}
});
}
</script>

So it looks like the info I need is in:

Code:

position: results[0].geometry.location

but I'm not sure how to enter that as a value in:

Code:

<input type='hidden' name='geolocation' value'?' />

Warning: If you are taking advice from me, then you are in really bad shape. Let's both hope for your code's sake that someone comes along and pulls us out of this fix that I've gotten us into.

But it seems that I might be wasting my time because the variable would be set on pageload, correct? If that is the case, I don't know how to have the variable update. I imagine your suggestion of AJAX is the answer, but I don't know how to implement that at all.

Warning: If you are taking advice from me, then you are in really bad shape. Let's both hope for your code's sake that someone comes along and pulls us out of this fix that I've gotten us into.

I doubt that would even work, because HTML attribute values are strings, not HTML (and hence not HTML elements).

The block of JavaScript you have in the previous post has a function that handles the geocoder result. You'll want to put the code there so that it will run when the geocoder's result is handled.

You will need to know how to locate parts of the document. The document object model has a bunch of methods for that which are accessible in JavaScript (you can see one of them in the code you posted: GetElementById()). The model also provides each type of element with an interface for manipulating its properties (such as input elements); the form element interface, for example, includes a property that lists all the form fields contained by the form.

You will need to know how to locate parts of the document. The document object model

There's an alternative that might also work for you, and that's creating the form using javascript and post it directly from the function where you have the long/lat values. But you'd be using DOM either way. You might also want to look at jQuery for accessing and manipulating the DOM.