Pandi: jQuery required setzen bei select Auswahl

Beitrag lesen

Hallo,

folgende Ausgangssituation

<form form method="post">

	<label for="autoStart">Automatisch starten?</label>
	<input name="autoStart" type="radio" value="Ja" checked="" /> Ja 
	<input name="autoStart" type="radio" value="Nein"/> Nein

	<label for="f1">Feld 1*</label>
	<select name=f1"" id="f1" required="">
		<option value="">-- Bitte wählen --</option>
		<option value="f1-1">Eintrag 1 - Feld 1</option>
		<option value="f1-2">Eintrag 2 - Feld 1</option>
		<option value="f1-3">Eintrag 3 - Feld 1</option>
	</select>

	<label for="f2">Feld 2*</label>
	<select name="f2" id="f2" required="">
		<option value="">-- Bitte wählen --</option>
		<option value="f2-1">Eintrag 1 - Feld 2</option>
		<option value="f2-2">Eintrag 2 - Feld 2</option>
		<option value="f2-3">Eintrag 3 - Feld 2</option>
	</select>

	<button id="eintragen">Speichern</button>

</form>



<script src="jquery311min.js"></script>

<script> 
	$(document).ready(function(){

		$(':radio[name=autoStart]').click(function(){
			    
			    if($(this).val() == 'Ja'){
			        $("#f1").prop('required',true);
			        $("#f2").prop('required',true);
			    } else {
			    	$("#f1").prop('required',false);
			        $("#f2").prop('required',false);
			    }
			
			});

	});              
</script>

Wenn Automatisch starten? auf ja steht, sind die Felder #f1 und #f2 auf required. Lege ich den Schalter auf Nein, werden diese entfernt, klappt.

Jetzt kommt die Schwierigkeit:
Wenn in #f1 oder #f2 etwas gewählt wird, dann sollte im anderen Feld das required wieder entfernt werden.

Beispiel:

Automatisch Starten: Ja Feld 1: Etwas gewählt Feld 2: ist kein required mehr.

Wenn ich ausversehen im Feld 1 <option value="">-- Bitte wählen --</option> wähle. soll natürlich das required wieder aktiviert werden und zwar in beiden Feldern.

Wie könnte ich dieses angehen? Habt ihr eine Lösung / Idee?