onchange="this.form.submit()"

[Bernd]

Hallo,

ich habe folgende Funktion

		$( "#testLocation" ).submit(function( event ) {

			event.preventDefault();

			var send = $("#testLocation").serialize();

			$.ajax({
				
				type: 	  "POST",
				url:  	  "insertLocation.php",
				data:     send,
				dataType: 'json',
				
				success:  function(data) {

					$("#location_id option:last").after($('<option value="'+ data.l_code +'" selected>'+ data.l_locationname +'</option>'));
					$("#location_id").trigger("chosen:updated");

					function clearInputs(data){
						$("#testLocation :input").each(function(){
							$(this).val('');
						});
					};

					clearInputs();

					$.fancybox.close();
				}
			
			});

		});

Habe ich die Möglichkeit nach dem Update folgende Option auszuführen

onchange="this.form.submit()"

Dieses benötige ich für das Abschicken von meinem Eintrag

<form action="" method="POST">
					<select name="location_id" id="location_id" data-placeholder="Bitte wählen..." class="chosen-select" style="margin-top: 0; width: 85%" onchange="this.form.submit()">
					<option value=""></option>
					<?php foreach($frontend_location as $array): ?>
					<option value="<?php echo htmlspecialchars($array['l_code']); ?>" <?php echo ($b_veranstaltungsort == $array['l_code'] ? "selected" : "");?>>
					<?php echo htmlspecialchars($array['l_locationname'] . " " . $array['l_plz'] . " " . $array['l_ort'] ); ?>
					</option>
					<?php endforeach; ?>
					</select>
				</form>

[Rolf B]

Hallo Bernd,

probier's doch aus 😉. Müsste ich auch tun.

Aber prinzipiell: Ja, das sollte gehen.

The change event is fired for <input>, <select>, and <textarea> elements when an alteration to the element's value is committed by the user. Unlike the input event, the change event is not necessarily fired for each alteration to an element's value.

D.h. der Submit erfolgt nicht, während der User versucht, im SELECT zu navigieren, sondern erst dann, wenn die Änderung "bestätigt" wird.

Ob es Bedienungsfälle gibt, wo der User nicht so recht weiß wie er diese Bestätigung ausführen soll, musst Du schauen. Aus dem SELECT hinaustabben oder mit der Maus sonstwohin klicken, das sollte es tun. Ob sich das intuitiv bedient - sprich: ob die Idee gut ist - merkst Du dann auch.

Rolf

[Bernd]

Hallo,

wie so oft, es ist eine interne Seite, ich weiß wo und wie ich klicken muss und die Menschen die damit jeden Tag arbeiten auch ;)

Die Frage ist halt, wo muss ich das onchange="this.form.submit()" einbauen dass es nach dem Update von einer Location funktioniert.

[Bernd]

Ok, so kann ich den Reload ausführen

$("#location_id").trigger("onchange");

[Rolf B]

Hallo Bernd,

entweder habe ich dich komplett missverstanden, oder du schießt von hinten durch die Brust ins Auge.

Welches Problem musst du mit dem trigger lösen? Wenn der Anwender den ausgewählten Wert ändert, sollte change doch automatisch ausgelöst werden. Und, wann und wie löst du das Script aus, das den trigger enthält?

Verwirrt
Rolf

[Bernd]

Hallo,

da habe ich wohl zu wenig kopiert, sorry. Ich habe ein Select wo ich eine Location auswählen kann

<form action="" method="POST">
						<select name="location_id" id="location_id" data-placeholder="Bitte wählen..." class="chosen-select" style="margin-top: 0; width: 85%" onchange="this.form.submit()">
						<option value=""></option>
						<?php foreach($frontend_location as $array): ?>
						<option value="<?php echo htmlspecialchars($array['l_code']); ?>" <?php echo ($b_veranstaltungsort == $array['l_code'] ? "selected" : "");?>>
						<?php echo htmlspecialchars($array['l_locationname'] . " " . $array['l_plz'] . " " . $array['l_ort'] ); ?>
						</option>
						<?php endforeach; ?>
						</select>
					</form>

Wenn ich hier die Location wechsle dann klappt das onchange="this.form.submit()" wunder. Jetzt kann es sein, dass eine Location nicht im System hinterlegt ist, also habe ich ein Link hinzugefügt

<a class="variousLocation" href="#inlineLocation" style="display: block; font-size: 13px; margin-top: -30px;">Neue Location hinzufügen</a>

Hier geht ein PopUp Fenster aus wo ich alle Felder ausfüllen kann. Nach dem Abschicken wird das Select gefüllt und hier möchte ich dann das onchange ausführen, aber nur im success Fall. Und dafür habe ich das $("#location_id").trigger("onchange"); benötigt.

[Rolf B]

Hallo Bernd,

ok, wenn es jetzt so funktioniert wie Du es haben willst, dann würde ich sagen: Thema gelöst :)

Es ist, meine ich, generell so, dass die input- und change-Events nicht ausgelöst werden, wenn die Wertänderung per JavaScript erfolgt.

Rolf

[pl]

Ja, Du musst Dich schon entscheiden ob das <form> submittet werden soll ODER ob ein AJAX Request rausgehen soll. Im beiden Fällen mit den im <form> vorliegenden Eingaben. MFG

PS: Beispiel für this.form.submit() als onChange Event auf einem <select>