HTML Form

[SteveJo]

Hi,
I'm trying to create a form with two boxes for an insurance site. I want that in the first box the user will select the type of insurance and in the second box type the zip code. For every insurance type, the surfer will be directed to a different URL.

This is the code that I have, but of course that it doesn't work:

<form name="mainform">
        <tr>
            <td colspan="2">
                <select name="src" id="type">
                    <option value="http://www.mysite.com/results-car.html">Auto</option>
                    <option value="http://www.mysite.com/results-home.html">Home</option>
                    <option value="http://www.mysite.com/results-life.html">Life</option>
                    <option value="http://www.mysite.com/results-health.html">Health</option>
                    <option value="http://www.mysite.com/results-motorcycle.html">Motorcycle</option>
                    <option value="http://www.mysite.com/results-business.html">Business</option>
                </select>
            </td>
            <input type="hidden" name="source" value="google" />
        <tr>
            <td><input type="text" name="zipcode" maxlength="5" id="zip" />
</td>

        </tr>
        <tr>
            <td colspan="2" style="text-align:center;"><input type="submit" id="button" value="Go"/></td>

        </tr>

    </table>
</form>

For example, for auto insurance the URL should be:

http://www.mysite.com/results-car.html?zipcode=10001&source=google

Thanks!!

[bionoid]

Could do something like this:

<form name="mainform" method="get">
	<table>
		<tr>
			<td colspan="2">
				<select id="type" onchange="this.form.action = this.value;">
					<option value="http://www.mysite.com/results-car.html">Auto</option>
					<option value="http://www.mysite.com/results-home.html">Home</option>
					<option value="http://www.mysite.com/results-life.html">Life</option>
					<option value="http://www.mysite.com/results-health.html">Health</option>
					<option value="http://www.mysite.com/results-motorcycle.html">Motorcycle</option>
					<option value="http://www.mysite.com/results-business.html">Business</option>
				</select>
				<script type="text/javascript">document.getElementById('type').onchange();</script>
			</td>
		</tr>
		<tr>
			<td><input type="text" name="zipcode" maxlength="5" id="zip" /></td>
		</tr>
		<tr>
			<td colspan="2" style="text-align:center;"><input type="submit" id="button" value="Go"/></td>
		</tr>
	</table>
	<input type="hidden" name="source" value="google" />
</form>

[Charles]

1) That JavaScript will not work. The select object doesn't have a value, each option does and the select object has a selectedIndex property.

2) DO NOT RELY ON JAVASCRIPT FOR THIS. It fails for vast numbers of users and because some of them are disabled persons using adaptive browsers that cannot support JavaScript doing so is sometimes and in some places against the law. Commercial web sites are particularly vulnerable to this legal requirement.

3) That does not mean, however, that you can't use JavaScript only that you can't rely on it. Make that a real FORM that submits itself to a server side script that returns a redirect. Then, and only then, you can use something more like:

<form action="send-me.php" onsubmit="self.location = this.src.options[this.src.selectedIndex].value; return false">

[bionoid]

1) That JavaScript will not work. The select object doesn't have a value, each option does and the select object has a selectedIndex property.

Really Charles, I gather you didn't try it then?
<select> elements DO have value members.

[Charles]

That is, however, a non-standard extension. Support will be spotty at best.

[SteveJo]

Actually, it works. Thank you bionoid.
Charles - if it works, I don't see the problem. I'll be glad if you tell me what is the problem.

Thanks.

[spufi]

Non-standard extension means not all browsers might support it.

[Charles]

Actually, it works. Thank you bionoid.
Charles - if it works, I don't see the problem. I'll be glad if you tell me what is the problem.

Thanks.

That's kind of the whole problem with JavaScript. Quite often it'll work on your browser but not on others. Your users will be laughing at your incompetence and you'll never realize it. Mentioning that, however, will get you banned from the JavaScript forum around here.

[bionoid]

Regardless of it working in this situation or not, I have learnt something new. That is the point of participating on the forum after all.
After hours of looking around I understand why now. It's mainly due to the multiple selection part of its capabilities.
One does think they know better, so if I came across rude then I apologise Charles.

[anilgangwar]

hi friends i am new member at this forum site ....
Today HTML- 5 in the market, which is very advance in the HTML 5 the viedo files... the html five is the best your code is good i want to share HTML 5 code with you.....
<!DOCTYPE HTML>
<html>
<body>

<video width="320" height="240" controls="controls">
<source src="movie.mp4" type="video/mp4" />
<source src="movie.ogg" type="video/ogg" />
<source src="movie.webm" type="video/webm" />
Your browser does not support the video tag.
</video>

</body>
</html>

it is an example of HtML 5 code

friends i want to share some health tips
When eating out, always choose the smallest portion size available.
When we choose larger meals, most of us tend to eat past the point of hunger and in doing so consume more kilojoules than we need which contributes to weight gain.Remember that if you are still hungry after choosing a smaller meal, you can always fill up with something else and enjoy a wider variety of tastes in the process
for more information visit ...
knee pain arthritis
natural cholesterol lowering
best protein shakes for women