• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Formulareingaben per JavaScript überprüfen

blabla333

Mitglied
Ich weiß, dass es unzählige Posts (auch in anderen Foren) gibt, aber irgendwie finde ich nicht die richtige Anleitung für mich.
Ich möchte beim Senden eines Formulars zunächst prüfen, ob in einem select-Element überhaupt eine Auswahl getroffen wurde. Wenn nicht, dann wird das Formular auch nicht gesendet und das entsprechende Element farblich eingefärbt.

So stimmt das ja noch nicht...

Code:
<form action="" method="post" name="step2" onsubmit="checkSelect();">
<select name="meinselect" size="1">
<option value="">...</option>
<option value="val1">Eintrag 1</option>
<option value="val2">Eintrag 2</option>
<option value="val3">Eintrag 3</option>
</select>
</form>

function checkSelect(){
  if(document.step2.meinselect.selectedIndex == 0){
    // Wie geht es nun weiter? Das Formular soll ja nicht abgeschickt werden...
  }
}
 
Nur als Beispiel und nicht zum copy & paste bestimmt:

Code:
// Beim Klick auf den Submit-Button
$('button').on('submit', function(event) {
   
    // übergib den Value der selektierten <option>
    var optionValue = $('select[name=meinselector]').val();
 
  // Falls die Variable keinen Value zurückliefert
    if ( !optionValue ) {

        // Disable den Submit-Button
        event.preventDefault;
    }
})

Installiere jQuery und versuche erstmal, den Wert-Value in einer Variablen zu speichern. Wenn das klappt, kombiniere es mit einem Eventlistener. Kommst du damit jetzt noch nicht klar, dann schau dir die Funktionen in der Doku an und google. Stackoverflow ist da voller nützlicher Hinweise.
 
Zurück
Oben