How to capture a form element and use dynamically in the post url?

Question

I'm trying to build a form which submits a URL which contains a lon/lat that has been passed over from Google Maps. I have managed to get it so the lon/lat is passed into input fields in the form, how would I go about using these values dynamically in the post URL, i.e.:

action="search.asp?[lon][lat]

Answer 1

If you want to get the values from the form into the URL, set the method attribute to get:

<form method="search.asp" action="get">

. This will put the values of the lon and lat fields of the form in the URL. Example:

search.asp?lat=[lat value]&lon=[lon value]

For more information, read this page. Excerpt:

If the processing of a form is idempotent (i.e. it has no lasting observable effect on the state of the world), then the form method should be GET. Many database searches have no visible side-effects and make ideal applications of query forms.

Answer 2

Using javascript you can change the action attribute of the form. So, create a form..

<form name="myForm">
  <input type="hidden" name="lon" value="123" />
  <input type="hidden" name="lat" value="321" />
  ...
  <button onclick="setAction();">Submit</button>
</form>

Then in the head of the page add the setAction function..

<script type="text/javascript">
  function setAction()
  {
    var lon = document.myForm.lon.value;
    var lat = document.myForm.lat.value;

    document.myForm.action = "search.php?["+lat+"]["+lon+"]"';
    document.myForm.submit();
  }
</script>

Hope this helps, it's how I have done this in the past!

Answer 3

Try using:

<form action="search.php" method="get">
 <input type="hidden" name="lon" value="<?php echo $lon_fromGoogleMaps; ?>" />
 <input type="hidden" name="lat" value="<?php echo $lat_fromGoogleMaps; ?>" />
 <!-- The Rest of your Form... -->
 <input type="submit" value="Submit!" />
</form>

Or if you want to use the form as post:

<form action="search.php?lon=<?php echo $lon_fromGoogleMaps; ?>&amp;lat=<?php echo $lat_fromGoogleMaps; ?>" method="post">
 <!-- The Rest of your Form... -->
 <input type="submit" value="Submit!" />
</form>

I see you tagged this as Javascript as well, and as Google Maps relies heavily on Javascript, you may have the Lon and the Lat passed as Javascript variables...

<script type="text/javascript">
 // Obviously, execute this code after the DOM has loaded...
 var formAction = document.searchForm.action;
 formAction = formAction + '?lon=' + lon_fromGoogleMaps + '&amp;lat=' + lat_fromGoogleMaps;
 document.searchForm.action = formAction;
</script>
<form action="search.php" method="post" name="searchForm">
 <!-- The Rest of your Form... -->
 <input type="submit" value="Submit!" />
</form>