in Formular Radiobuttons überprüfen

whistler81 · 7. Feb 2013

Hallo lb Community,

ich wage mich gerade neu an Java heran und habe folgendes Problem bzw. möchte folgendes lösen:

Ich habe ein Webformular für eine Kongressanmeldung erstellt.
Der User muss nun entweder ein Kongressticket buchen ODER ein Ticket für einen Workshop welche parallel stattfinden.

Im Formular gibt es nun die auswhlmöglichkeiten dazu u.a. eben auch "Kein Kongress" und "Kein Workshop". Ich will verhinden, dass der User eben beidemale "KEIN" auswählt.
Pro Radiobutton-Gruppe gibt es mehrere auswahlmöglichkeiten (4x für Kongress; 2x für Workshop)

Gefunden hätte ich bereits diesen JAVA Code:

Java:

function checkForm() {
 if(!document.getElementById('Workshop').checked) {
  alert("Bitte einen Workshop auswählen!");
  document.getElementById('Workshop').focus();
  return false;
 }

 if(!document.getElementById('Kongress').checked) {
  alert("Bitte eine Kongressanmeldung auswählen!");
  document.getElementById('Kongress').focus();
  return false;
 }
}

Formular sieht so aus:

HTML:

<input id="Kongress" value="10" name="Kongress" type="radio">
<input id="Kongress" value="12" name="Kongress" type="radio">

<input id='Workshop' value='50' name='workshop' type='radio'>

usw.

Problem was ich nun habe ist dieses, dass bei der id="Kongress" nur der erste Radiobutton "erkannt" wird (=Keine Anmeldung zum Kongress). Wähle ich einen andere Radiobutton aus (2Tagesticket etc.) bekomme ich trotzdem die Meldung "Bitte eine Kongressanmeldung auswählen")

Ich komm nicht drauf wo mein Fehler im Script ist.

Kurz gesagt: Ich möchte haben, dass der User sich zumindest für den Kongress anmeldet ODER für einen Workshop. Beidemale auf "KEINE Anmeldung" sollte unterbunden werden.

Wäre für Eure Hilfe sehr dankbar.

Liebe Grüße
Clemens

FanClub · 7. Feb 2013

Ich werde mich gleich damit auseinandersetzen aber es handelt sich hier um Javascript.
Das hat nichts mit Java zu tun.

Evil-Devil · 7. Feb 2013

1) IDs müssen eindeutig sein
2) Zeig bitte nach Möglichkeit das komplette Formular, das macht die Entwicklung des notwendigen JavaSCriptes wesentlich einfacher.

whistler81 · 7. Feb 2013

HIer mal der, auf die wesentlichen INhalte gekürzte-Formular Code

HTML:

<script language="JavaScript" type="text/javascript">

function checkForm() {
 if(!document.getElementById('Workshop').checked) {
  alert("Bitte einen Workshop auswählen!");
  document.getElementById('Workshop').focus();
  return false;
 }

 if(!document.getElementById('Kongress').checked) {
  alert("Bitte eine Kongressanmeldung auswählen!");
  document.getElementById('Kongress').focus();
  return false;
 }
 if(document.getElementById('email').value == "") {
  alert("Bitte Ihre E-Mail-Adresse eingeben!");
  document.getElementById('email').focus();
  return false;
 }
 if(!checkEmail(document.getElementById('email').value,false)) {
  alert("Bitte geben Sie eine korrekte E-Mail-Adresse ein!");
  document.getElementById('email').focus();
  return false;
 }
}
</script>

<body>
<form name='anmeldung' action='http://anmeldung.rtaustria.at/test/kongress/formmail_test.php' method='post' onsubmit='javascript:return checkForm();'>
<table border="0" width="100%">
	
			<tr>
				<input value="10" id="Kongress" name="Kongress" type="radio"></span></font></td>
				<td width="393">
				<font size="2">Keine Kongressanmeldung</font></td>
				<td align="center">&nbsp;</td>
				<td align="center">&nbsp;</td>
			</tr>
			<tr>
				<td width="34"><font size="-1">

				<input id="Kongress" value="11" name="Kongress" type="radio">

				</font></td>
				<td width="393">
				<span style="font-family: Verdana; border-collapse: separate; color: rgb(0, 0, 0); font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px">
				<font size="2">2-Tages Ticket (Fr-Sa)</font></span></td>
				<td align="center"><font size="2">€ 75</font></td>
				<td align="center"><font size="2">€ 105</font></td>
			</tr>
			<tr>
				<td width="34"><font size="-1">

				<input id="Kongress" value="12" name="Kongress" type="radio">
				
				</font></td>
				<td width="393"><font size="2">1-Tages Ticket Freitag</font></td>
				<td align="center"><font size="2">€ 55</font></td>
				<td align="center"><font size="2">€ 75</font></td>
			</tr>
			<tr>
				<td width="34"><font size="-1">

				<input id="Kongress" value="13" name="Kongress" type="radio"></font></td>

				<td width="393"><font size="2">1-Tages Ticket Samstag</font></td>
				<td align="center"><font size="2">€ 55</font></td>
				<td align="center"><font size="2">€ 75 </font></td>
			</tr>
			<tr>
				<td width="34"><font size="-1">

				<input id="Kongress" value="31" name="Kongress" type="radio">

				</font></td>
				<td width="393"><font size="2">2-Tages Ticket Studierende 
				</font></td>
				<td align="center"><font size="2">€ 20</font></td>
				<td align="center"><font size="2">€ 20</font></td>
			</tr>
		</table>
		
		
		<table border='1' width='50%'>
			<tr>
				<td width='33'>&nbsp;</td>
				<td width='226'>&nbsp;</td>
				<td align='center'><font size='2'><b>freie Plätze</b></font></td>
				<td align='center' width='249'><i><b><font size='2'>Anmeldung 
				bis 31.3.2012 möglich</font></b></i></td>
			</tr>

			<tr>
				<td width='33'><font size='-1'>
				<input id='Workshop' value='50' name='workshop' type='radio'>				
				</font></td>
				<td width='226'><font size='2'>Keine Workshopanmeldung</font></td>
				<td align='center'>&nbsp;</td>
				<td align='center' width='249'><font size='2'></font></td>
			</tr>


			<tr>

				<td width='33'>
				"; 
				if ($hyg > 0)
				{
					echo"
				<font size='-1'>
				<input id='Workshop' value='62' name='workshop' type='radio'>
				</font>";
				}
				else
				{ 
					echo" <font size='2'> ausgebucht! </font>";
				}
				echo"
				
				</td>
				<td width='226'><font size='2'>Hygiene in der Radiologie</font></td>
				<td align='center'><font size='2'> $hyg </font></td>
				<td align='center' width='249'>
		<span style='font-family: Verdana; border-collapse: separate; color: rgb(0, 0, 0); font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px'>
				<font size='2'>€ 90</font></span></td>		
				</tr>



				<tr>
				<td width='33'>
				"; 
				if ($radio > 0)
				{
					echo"
				<font size='-1'>
				<input id='Workshop' value='63' name='workshop' type='radio'>
				</font>";
				}
				else
				{ 
					echo" <font size='2'> ausgebucht! </font>";
				}
				echo"
				
				</td>
				<td width='226'><font size='2'>Applikation von Radiopharmaka</font></td>
				<td align='center'><font size='2'> $radio </font></td>
				<td align='center' width='249'>
		<span style='font-family: Verdana; border-collapse: separate; color: rgb(0, 0, 0); font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: -webkit-auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px'>
				<font size='2'>€ 90</font></span></td>		
				</tr>		
		</table>
		
<input value="Anmeldung abschicken" name="Anmeldung abschicken" type="submit">
</form>
</body>

FanClub · 7. Feb 2013

So etwa könnte das aussehen.

HTML:

<html>
<body>
<form>
<input id="Kongress" value="10" name="Kongress" type="radio" onclick="checkForm();">Kongress ja
<input id="Kongress_Nein" value="12" name="Kongress" type="radio" onclick="checkForm();">Kein Kongress

<input id='Workshop' value='50' name='workshop' type='radio' onclick="checkForm();">workshop ja
<input id='Workshop_Nein' value='55' name='workshop' type='radio' onclick="checkForm();">kein workshop
</form>
<script type="text/javascript">

function checkForm() {
 if(document.getElementById('Workshop_Nein').checked && document.getElementById('Kongress_Nein').checked) {
  alert("Bitte einen Workshop oder Kongress auswählen!");
  document.getElementById('Kongress_Nein').checked=false;
  document.getElementById('Workshop_Nein').checked=false;
  return false;
 }
}
</script>
</body>
</html>

whistler81 · 7. Feb 2013

Danke für den Tipp,

funktioniert aber leider nicht. Obwohl "Kein Kongress" und "Kein Workshop" ausgewählt wurde, wir das Formular abgeschickt...

Ich probier mal weiter herum...try&error 🙂

whistler81 · 7. Feb 2013

Erledigt!! Danke!!!

habe mich verschrieben, deswegen hat es nicht funktioniert!

Herzlichen Dank für die rasche Hilfe!!

Liebe Grüße
Clemens

in Formular Radiobuttons überprüfen

whistler81

Mitglied

FanClub

Mitglied

Evil-Devil

Top Contributor

whistler81

Mitglied

FanClub

Mitglied

whistler81

Mitglied

whistler81

Mitglied

Aktuelle Jobs

Neue Themen

Ähnliche Themen