• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] Radio Auswahl soll bei click auf Submit Button auf bestimmte Seite leiten

W

werkschu

New member
Hallo Leute,

ich bin noch recht neu in der JavaScript Programmierung und hoffe Ihr könnt mir bei einen Problem weiterhelfen.
Ich habe ein Radio Auswahl Menü und möchte je nach Auswahl im gleichen Fenster auf eine bestimmte Seite leiten.
Dies soll passieren wenn man auf den Submit Button klickt. Klappt leider nicht, was habe ich denn falsch gemacht bzw.
wie muss der richtige Code aussehen. Eventuell gibt es dafür auch eine kürzere und elegantere Lösung als mein Ansatz.

Grüße

Marcus

Der Code:
HTML: 
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Fenstertitel</title>
 <BODY>




</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
function radioWert(rObj) {
  for (var i=0; i<rObj.length; i++) if (rObj[i].checked) return rObj[i].value;
 alert("Bitte eine Seite waehlen");
}

// -->
</script>

<form action="#" method="post" name="myForm">
  <input type="radio" name="myRadio" value="http://www.seite.de/1.html">zur Auto Seite<BR/>
  <input type="radio" name="myRadio" value="http://www.seite.de/2.html">zur Motorrad Seite<BR/>
  <input type="radio" name="myRadio" value="http://www.seite.de/3.html">zur Traktor Seite<BR/><BR/>
  
  
  <input type="submit" value="Absenden" onClick="document.location.href=(radioWert(document.myForm.myRadio));">
         

</form>
 	
 
 
 
    
    </body>
    </html>
 
mikdoe schrieb:
Und bitte, schreibe JS Eventhandler (hier onclick) komplett klein. Man schreibt die nicht gemischt groß und klein, das gibt es nur bei Style Eigenschaften.
Zum Vergrößern anklicken....
nein, das gibt es nicht nur für styleeigenschaften, jedes tag und jedes attribut kann gemischt groß und klein geschrieben werden.
 
hesst schrieb:
nein, das gibt es nicht nur für styleeigenschaften, jedes tag und jedes attribut kann gemischt groß und klein geschrieben werden.
Zum Vergrößern anklicken....
Wusste ich :)

@werkschu: hesst legt immer Einspruch ein, wenn ich empfehle, die Eventhandler klein zu schreiben. Das ist ein running gag bei uns. Ich finde es besser, alles klein zu schreiben, weil der Rest in JS (bis auf Style Eigenschaften) ja auch klein geschrieben wird.
 
mikdoe schrieb:
Das ist ein running gag bei uns.
Zum Vergrößern anklicken....
das ist kein running gag, sondern die richtigstellung einer falschen aussage.

mikdoe schrieb:
Ich finde es besser, alles klein zu schreiben, weil der Rest in JS (bis auf Style Eigenschaften) ja auch klein geschrieben wird.
Zum Vergrößern anklicken....
wenn du es besser findest, ist das ok, wenn andere anderes besser finden auch.
und in js musst du onclick klein schreiben, das hat aber nichts mit html zu tun.
und weil js nichts mit html zu tun hat, kann man vielleicht empfehlen, js und html zu trennen.
 
Nachdem die beiden jetzt der Meinung sind, beide hätten recht, können wir ja wieder zurück zu Deinem Problem kommen. :D

Grüße Dich, werkschu, und ein herzliches Willkommen hier im Forum von jswelt!

Was mir sofort ins Auge springt: document.location.href (onclick) würde auch die alert()-Box als return-Value annehmen - das führt zu Chaos im Browser. Ich empfehle eher, dass Du genau dies in die Funktion selbst legst (also entweder Weiterleitung oder alert()).

Ansonsten funktioniert es wie gewünscht!!!

Code: 
function radioWert(rObj) {
  for (var i=0; i<rObj.length; i++){
    if (rObj[i].checked){
     document.location.href = rObj[i].value;
     return;
    }
  }
  alert("Bitte eine Seite waehlen");
}

Der Button zum Abschicken sieht dann nur noch so aus:
<input type="button" value="Absenden" onclick="radioWert(document.myForm.myRadio);">

Grüße
 
Hallo,
erstmal vielen Dank an Euch für die Hilfe und das freundliche Willkommen hier im Forum :)

Und ein Sorry, kann leider erst jetzt antworten.

Vielen Dank auch an SteelWheel für das Beispiel :)

Ich hatte vergessen noch zu schreiben, dass zum Form noch eine Checkbox gehört und erst zur Seitenauswahl
weitergeleitet werden soll, wenn die Checkbox checked ist. Die Alert "Bitte Seite waehlen" muss also angezeigt
werden wenn keine Radio Auswahl getroffen wurde, dann soll auch nicht weitergeleitet werden. Ebenso muss die
Checkbox checked sein damit überhaupt weitergeleitet wird. Ich habe den Code entsprechend erweitert, allerdings
funktioniert es nicht wie gewünscht. Jetzt werden die Alerts alle nacheinander ausgeführt und Weitergeleitet wird auch
nicht. :confused: Denke die Schleife macht die Probleme... Wäre nett wenn Ihr nochmal schaut.
Grüsse Marcus

Code: 
<html>
<head>
<script language="JavaScript" type="text/javascript">
<!--

function radioWert(rObj)
 {
  for (var i=0; i<rObj.length; i++){
    if (rObj[i].checked){
     document.location.href = rObj[i].value;
     return;
    }

if (rObj[i].checked==false)
{ 
alert("Bitte eine Seite waehlen");
}

if (document.myForm.muss.checked==false)
{
alert("Bitte Checkbox abhaken");
}

  }
 
}
// -->
</script>
<form action="#" method="post" name="myForm">
<input type="radio" name="myRadio" value="http://www.seite.de/1.html">zur Auto Seite<BR/>
<input type="radio" name="myRadio" value="http://www.seite.de/2.html">zur Motorrad Seite<BR/>
<input type="radio" name="myRadio" value="http://www.seite.de/3.html">zur Traktor Seite<BR/><BR/>
<input name="muss" type="checkbox">
<input type="button" value="Absenden" onclick="radioWert(document.myForm.myRadio);">

</form>
</body>
</html>
[/HTML]
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben