| |
You are here: Experts > Internet/Online > Personal Web Pages > General HTML/Web Design Programming Q`s > Website Location Finder Mapping Form for Multiple Locations
Expert: Fernando Doylet
Date: 5/9/2008
Subject: Website Location Finder Mapping Form for Multiple Locations
Question
QUESTION: I have written a page at www.spotshappen.com/location.html on this page I have a form where you can fill in your current location and it will guide you to the location of the business store by opening you Yahoo Maps and giving you driving directions. However since he has 2 locations it is cumbersome since I need a form for each location. How can I put a drop box on this page with both locations. After you choose a location it will then put the proper information on the destination behind the scenes in the form so that you get the proper driving directions. I need to modify this page but I also have a person who wants the same thing but has 5 locations to get to. Thanks for any help you can give me.
ANSWER: Hi Dave,
You need a drop down box like the one shown at http://www.w3schools.com/tags/tag_option.asp
with source code like...
<select>
<option value ="location1">Main Plant</option>
<option value ="location2">Drop-Off Store</option>
<option value ="location3">Store A</option>
<option value ="location4">Store B</option>
<option value ="location5">Store C</option>
</select>
---------- FOLLOW-UP ----------
QUESTION: I have set up the drop down list to do as you have indicated. However, I am not clear on how to get the new address for each site into the rest of the form based upon the choice made. Here is the code I have but the address in it is static and does not change when I change options.
<td class="style52" style="height: 150px">
<div align="center">
<form name="frmFindDirections" method="get" target="winExternalSite" action="http://maps.yahoo.com/py/ddResults.py" style="height: 231px">
<div>
<input type="hidden" value="Tmap" name="Pyt" />
<input type="hidden" value="1" name="doit" />
<input type="hidden" name="newname" value="" />
<input type="hidden" name="newdesc" />
<input type="hidden" value="2910 Abbeville Hwy" name="newtaddr" />
<input type="hidden" value="29624" name="newtcsz" />
<!-- start data field >> -->
<div class="DI_data_field">
<div style2="" class="style48">
<span class="style28">
<span class="style45">
<select name="Select1" style="height: 31px; width: 93%">
<option>Choose Your Ed Robinson Cleaners Location - Here
</option>
<option value="A">Location A - 2551 Forrest Drive Columbia, SC </option>
<option value="B">Location B - 4903 Forrest Drive Columbia, SC </option>
<option value="C">Location C - 800 Sparkleberry Lane Columbia, SC </option>
<option value="D">Location D - 4221 Hard Scrabble Road Columbia, SC </option>
<option value="E">Location E - 317 Royal Tower Drive Irmo, SC </option>
</select></span></span><strong><span class="style25"><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><br />
<br />
Enter a Starting Street Address:</font>
</span></strong>
<span class="style28">
<span class="style45">
<input size="40" name="newaddr" /></span></span></div>
</div>
<!-- ^^ end data field -->
<!-- start data field >> -->
<div class="DI_data_field">
<div class="style48">
<strong><span class="style25">
<font size="2" face="Verdana, Arial, Helvetica, sans-serif">
Enter City, State or Zip Code</font></span>
</strong></div>
<span class="style28">
<span class="style45">
<input size="40" name="newcsz" /></span></span>
</div>
<!-- ^^ end data field -->
<div class="DI_controls" style="height: 66px">
<span class="style28">
<input type="submit" value="Get Directions" name="Get Directions" style="width: 36%; height: 27px" class="style49" /></span>
<br />
<br />
<span class="style53"><strong>NOTE:
This will open up in a new window -
Yahoo Maps<br />
</strong></span></div>
</div>
</form>
</div>
</td>
ANSWER: Use the value option Dave...
<select>
<option value="2910 Abbeville Highway, 29624">Main Plant</option>
<option value="301 East Benson Street, 29621">Drop-Off Store</option>
<option value="address3">Store A</option>
<option value="address4">Store B</option>
<option value="address5">Store C</option>
</select>
By the way, you do not need to include city or state on maps.yahoo.com
Best Wishes,
Fernando Doylet, MIT
http://mason.doylet.org
---------- FOLLOW-UP ----------
QUESTION: I am sorry I am being dense on this but I am not getting it. I have updated the code as follows but get an error when windows starts to open a new window.
I think the problem is in the input type:
<form name="frmFindDirections" method="get" target="winExternalSite" action="http://maps.yahoo.com/py/ddResults.py" style="height: 231px">
<div>
<input type="hidden" value="Tmap" name="Pyt" />
<input type="hidden" value="1" name="doit" />
<input type="hidden" name="newname" value="" />
<input type="hidden" name="newdesc" />
<div class="DI_data_field">
<div style2="" class="style48">
<span class="style28">
<span class="style45">
<select name="Select" style="height: 31px; width: 93%">
<option>Choose Your Ed Robinson Cleaners Location - Here
<option value="2551 Forest Drive, 29204">Location A 2551 Forest Drive Columbia SC 29204</option>
<option value="4903 Forest Drive, 29206">Location B 4903 Forest Drive Columbia SC 29206</option>
<option value="800 Sparkleberry Lane, 29229">Location C 800 Sparkleberry Lane Columbia SC 29229</option>
<option value="4221 Hard Scrabble Road, 29223">Location D 4221 Hard Scrabble Road Columbia SC 29223</option>
<option value="317 Royal Tower Drive, 29063">Location E 317 Royal Tower Drive Irmo SC 29063</option>
</select>
</span><strong><span class="style25"><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><br />
<br />
Enter a Starting Street Address:</font>
</span></strong>
<span class="style28">
<span class="style45">
<input size="40" name="newaddr" /></span></span>
<!-- ^^ end data field -->
<!-- start data field >> -->
<div class="DI_data_field">
<div class="style48">
<strong><span class="style25">
<font size="2" face="Verdana, Arial, Helvetica, sans-serif">
Enter City, State or Zip Code</font></span>
</strong></div>
<span class="style28">
<span class="style45">
<input size="40" name="newcsz" /></span></span>
</div>
<!-- ^^ end data field -->
<div class="DI_controls" style="height: 66px">
<span class="style28">
<input type="submit" value="Get Directions" name="Select" style="width: 36%; height: 27px" class="style49" /></span>
<br />
<br />
<span class="style53"><strong>NOTE:
This will open up in a new window -
Yahoo Maps<br />
</strong></span></div>
</div>
</form>
Answer
Try adding an under_score in the 'action' and select name 'q2' (it works for me)...
<form name="frmFindDirections" method="get" target="winExternalSite" action="http://maps.yahoo.com/py/dd_Results.py" style="height: 231px">
<div>
<input type="hidden" value="Tmap" name="Pyt" />
<input type="hidden" value="1" name="doit" />
<input type="hidden" name="newname" value="" />
<input type="hidden" name="newdesc" />
<div class="DI_data_field">
<div style2="" class="style48">
<span class="style28">
<span class="style45">
<select name="q2" style="height: 31px; width: 93%">
<option>Choose Your Ed Robinson Cleaners Location - Here
<option value="2551 Forest Drive, 29204">Location A 2551 Forest Drive Columbia SC 29204</option>
<option value="4903 Forest Drive, 29206">Location B 4903 Forest Drive Columbia SC 29206</option>
<option value="800 Sparkleberry Lane, 29229">Location C 800 Sparkleberry Lane Columbia SC 29229</option>
<option value="4221 Hard Scrabble Road, 29223">Location D 4221 Hard Scrabble Road Columbia SC 29223</option>
<option value="317 Royal Tower Drive, 29063">Location E 317 Royal Tower Drive Irmo SC 29063</option>
</select>
</span><strong><span class="style25"><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><br />
<br />
Enter a Starting Street Address:</font>
</span></strong>
<span class="style28">
<span class="style45">
<input size="40" name="newaddr" /></span></span>
<!-- ^^ end data field -->
<!-- start data field >> -->
<div class="DI_data_field">
<div class="style48">
<strong><span class="style25">
<font size="2" face="Verdana, Arial, Helvetica, sans-serif">
Enter City, State or Zip Code</font></span>
</strong></div>
<span class="style28">
<span class="style45">
<input size="40" name="newcsz" /></span></span>
</div>
<!-- ^^ end data field -->
<div class="DI_controls" style="height: 66px">
<span class="style28">
<input type="submit" value="Get Directions" name="Select" style="width: 36%; height: 27px" class="style49" /></span>
<br />
<br />
<span class="style53"><strong>NOTE:
This will open up in a new window -
Yahoo Maps<br />
</strong></span></div>
</div>
</form>
Add to this Answer
Ask a Question
|
|
