PDA

View Full Version : how to select an optionand submit with one click by an formsubmit-button?



GeoFrid
02-04-2013, 04:52 PM
1) Script Title: Simple questionair-form

my newbee-´s Code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Simple Questionair</title>
<script type="text/javascript" language="JavaScript">
<!--
function frmSubmit()
{
if (document.forms[0].vorname.value.length < 3 )
{
alert ("Sie haben keinen 'Vornamen' angegeben.");return false;
}
if ( document.forms[0].nachname.value.length < 3 )
{
alert ("Sie haben keinen 'Nachnamen' angegeben.");return false;
}
if (document.forms[0].alter.value =="")
{
alert("Sie haben noch kein Alter eingegeben!");return false;
}
if (isNaN(parseFloat(document.forms[0].alter.value))) {
alert( " Das ist keine Zahl! \nBitte nur Zahlen eingeben!"); return false;
}
if (document.forms[0].alter.value < 18)
{
alert("Sie sind noch nicht 18 Jahre alt!");return false;
}
else
{
alert(" Alles klar, Sie sind alt genug! \n Bitte geben Sie einen Favoriten ein!");return true;
}
}
//-->
</script>

</head>
<body >

<form name="form" method="post" action="" onsubmit="return frmSubmit();">
<table width="95%" cellpadding="6" cellspacing="0">
<tr
<th scope="col"><h2><b>
<div align="left"><br>
<font color="windowtext" size="4" face="Arial">Umfrage:</font></div><br>
</b></h2>&nbsp;</th>
<th scope="col">&nbsp;</th>
</tr>
<tr >
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr >
<td>Vorname</td>
<td><input type="text" name="vorname" id="vorname" value="" size="30" maxlength="35" />
</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr >
<td>Nachname</td>
<td><input type="text" name="nachname" id="nachname" value="" size="30" maxlength="35" /> </td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr >
<td>Alter</td>
<td><input type="text" size="3" maxlength="2" name="alter" id="alter" value="" /></td>
<td>&nbsp;</td>
</tr>
<tr >
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr >
<td>WelcherKandidat war ihr Favorit?</td>
<td>
<form action="select.htm"> <!--*how can I combine the result of this options selection with <br>
one click of the submit- button to get an alert-Message from this one click-->
<p>Ihr Favorit:</p>
<p>
<select name="Favorit" size="1"
onchange="alert(this.form.Favorit.options[this.form.Favorit.selectedIndex].value)">

<option value="-----">-----</option>
<option value="Sie haben sich für B.Trüger entschieden !">B.Trüger</option>
<option value="Sie haben sich für D.Menti entschieden !">D.Menti</option>
<option value="Sie haben sich für H.Lodri entschieden !">H.Lodri</option>
<option value="Sie haben sich für G.Scheitertentschieden !" >G.Scheitert</option>
</select>
</p>
</form>
</td>


<body>

</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr bgcolor="gray">
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr >

</table>

<fieldset id="set2" >

<input type="button" value=" Abschicken " onclick="frmSubmit();"/>

<input type="reset" value="Löschen" onclick="frmReset();"/> <br>
<!-- I cannot understand why the form is not reset by this command! What is wrong?-->
</fieldset>
</table>
</form>
</body>
</html>




3) Describe problem: I do have two questions about the code above;
1) how can I connect the selected option with an alert message by clicking the send button?
2) Why is the form not reset by the last command and cleared?
Thank you for your tips.
GeoFrid

jscheuer1
02-04-2013, 05:02 PM
I'm not sure about 1), but 2) has two problems. There are too many forms and the reset button isn't in any of them, and I cannot see any frmReset() function. Luckily you shouldn't need one. A reset button that's in a form should automatically reset it, so make it all into one form, place the reset button as the last thing in the form, and get rid of the onclick of the reset button. That should take care of that. You will need to rethink your javascript code and perhaps the names and/or ids of the form elements to still get the same functionality. But that's doable and will allow you to collect data on the server side for all of the form elements with one send/submit action.

Oh, BTW - I moved this to the javascript section, it's not a Dynamic Drive script, is it?