Hi.

I have a form with two input fields which is used to calculate the distance between two locations using Google Maps.
The form looks like this:

<form id="calculate" name="distance" action="#" onsubmit="showLocation(); return false;">
        <input type="text" name="address1" value="" size="30" />
        <input type="text" name="address2" value="" size="30" />
        <input type="submit" name="find" value="Go!" />
</form>

I would like to be able to fetch the locations from the input fields and put them into this link which gives you driving directions:
Code:

http://maps.google.com/maps?saddr={address1}&daddr={address2}

The link is placed elsewhere on the same page. The values of the input fields are likely to be empty when the page loads.

Can someone help me with a way to get this solved?

Any help is appreciated. Thanks in advance.

I solved with the following script:

<script type="text/javascript">

function showDirections(){
    window.open("http://maps.google.com/maps?saddr="+escape(document.getElementById("address1").value)+"&daddr="+escape(document.getElementById("address2").value));
}

</script>

And the link:

<a href="#" onclick="javascript:showDirections(); return false;" target="_blank">Click</a>