Ich habe zwei Optionsfelder in einem HTML-Formular. Ein Dialogfeld erscheint, wenn eines der Felder leer ist. Wie kann ich prüfen, ob ein Optionsfeld ausgewählt ist?
Stellen wir uns vor, Sie haben HTML wie dieses
<input type="radio" name="gender" id="gender_Male" value="Male" />
<input type="radio" name="gender" id="gender_Female" value="Female" />
Für die Client-seitige Validierung, hier's einige Javascript zu überprüfen, welche ausgewählt ist:
if(document.getElementById('gender_Male').checked) {
//Male radio button is checked
}else if(document.getElementById('gender_Female').checked) {
//Female radio button is checked
}
Je nach der genauen Beschaffenheit Ihres Markups könnten die obigen Angaben noch effizienter gestaltet werden, aber das sollte für den Anfang genügen.
Wenn Sie nur sehen wollen, ob irgendein Radiobutton irgendwo auf der Seite ausgewählt ist, macht [PrototypeJS] (http://www.prototypejs.org/) es sehr einfach.
Hier's eine Funktion, die true zurückgibt, wenn mindestens ein Radio-Button irgendwo auf der Seite ausgewählt ist. Auch hier kann es sein, dass Sie die Funktion je nach Ihrem spezifischen HTML-Code anpassen müssen.
function atLeastOneRadio() {
return ($('input[type=radio]:checked').size() > 0);
}
Für die serverseitige Validierung (denken Sie daran, Sie können nicht vollständig von Javascript für die Validierung abhängen!), würde es von der Sprache Ihrer Wahl abhängen, aber Sie würden den "gender"-Wert des Anfrage-Strings überprüfen.
Mit jQuery würde es etwa so aussehen
if ($('input[name=gender]:checked').length > 0) {
// do something here
}
Lassen Sie mich das in Teile zerlegen, um es deutlicher zu machen. jQuery verarbeitet die Dinge von links nach rechts.
input[name=gender]:checked
input
begrenzt es auf Eingabe-Tags.[name=gender]
schränkt es auf Tags mit dem Namen gender innerhalb der vorherigen Gruppe ein.:checked
schränkt es auf Checkboxen/Radio-Buttons ein, die in der vorherigen Gruppe ausgewählt wurden.Wenn Sie dies ganz vermeiden wollen, markieren Sie eines der Optionsfelder im HTML-Code als angekreuzt (checked="checked"
), wodurch gewährleistet wird, dass ein Optionsfeld immer ausgewählt ist.
Ein Vanille-JavaScript-Weg
var radios = document.getElementsByTagName('input');
var value;
for (var i = 0; i < radios.length; i++) {
if (radios[i].type === 'radio' && radios[i].checked) {
// get value, set checked flag or do whatever you need to
value = radios[i].value;
}
}