JavaScript Forum

**uktvindex** · 09-25-2006, 06:52 PM

I'm after a bit of javascript I should imagine that works on a form.

I have a drop-down menu and I want someone to be able to select something from the drop down menu but the form is processed without the need of a submit button.

I've looked at the usual sites but can't find anything. Any help would appreciated thanks.

Nick

**mastercomputers** · 09-26-2006, 04:16 AM

You should always provide a submit button for a form, it's the default action that is expected as you're not thinking of people who don't have javascript enabled, who could not use your form because it relies only on an action performed by your drop down.

Here's an example, it has a submit button, which I use Javascript to disable it, so that if they do have javascript enabled they won't see it, if they don't however, you'll need to make sure that you handle submissions another way.

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-NZ">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>Autosubmission Select (Drop-Down) Menu</title>
		<script type="text/javascript">
			function goHere(page)
			{
				var changer = document.getElementById('changer');
				while(changer.firstChild)
				{
					changer.removeChild(changer.firstChild);
				}
				changer.appendChild((document.createElement('p').appendChild(document.createTextNode('You would have gone to this: '+page))));
			}
		</script>
	</head>
	<body onload="document.getElementById('go').style.display = 'none';">
		<form action="" method="post">
			<fieldset>
				<legend>Site Menu</legend>
				<div>
					<select id="goto" name="goto" onchange="goHere(this.value);return false;">
						<optgroup label="Main Network">
							<option label="News" value="news">News</option>
							<option label="Home" value="home" selected="selected">Home</option>
						</optgroup>
					</select>
					<input id="go" name="go" type="submit" value="Go" alt="Go" />
				</div>
			</fieldset>
		</form>
		<div id="changer">You are at home</div>
	</body>
</html>

If you need an explanation, feel free to ask.

Cheers,

MC

**uktvindex** · 09-26-2006, 10:59 AM

Thanks, looks good, I shall try it out tonight. talkupation coming your way..

**uktvindex** · 09-26-2006, 12:41 PM

Doesnt seem to work, at least not for what I need it for. My experience is in php and not javascript.

I have a drop down menu, the options are filled from a mysql database. Each option has a variable number which I want sent a page if you select it from the drop down.

If they dont have javascript enabled then there are other methods of selecting the variables so I don't want a submit button in any case.

Could you have another go for me?

**mastercomputers** · 09-29-2006, 02:50 AM

I can definitely have another go, but I need the exact requirements.

It doesn't matter how the information is put there, either done statically or from mysql, etc. What's important is from that drop down menu, what do you want to happen as I can alter the script to work under any situation, this was just an example to show a possible page loading, though I could have made it automatically go to the page instead of dynamically creating the page.

Basically, if someone selects an item from that drop down, what would you like it to do? Would you like it to submit that information straight away to a script to process or would you want something else to happen? Are we only dealing with this drop down, or is it a complete form.

If you can provide the form itself, after it's generated by PHP or you could supply how it's all generated, doesn't matter as long as I get the idea of the form you're working with.

Cheers,

MC

**Kirtan** · 09-30-2006, 02:46 AM

If you are using dreamweaver, just you jump menu.
Here is code. And i think you know how to bind select with mysql table data.

Code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_jumpMenu(targ,selObj,restore){ //v3.0
  eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
  if (restore) selObj.selectedIndex=0;
}
//-->
</script>
</head>

<body>
<form name="form1">
  <select name="menu1" onChange="MM_jumpMenu('parent',this,0)">
    <option>1</option>
    <option>2</option>
    <option value="test.php">3</option>
  </select>
</form>
</body>
</html>

**uktvindex** · 10-03-2006, 06:50 AM

Thanks, works well. Just what I wanted.

**Kirtan** · 10-05-2006, 12:00 PM

You are always welcome. If this is useful to you please give talkupataion.

**seomumbai** · 10-19-2006, 02:58 AM

Subbmiting a from with out a submit button click is not a good practice but if you want still doit then uyou can do it from server side but not from client side. You can submit a page when oyur drop down list selected index has been changed and See tht Auto post back of Drop down list is to be true in the properties of drop down list.