Javascript / AJAX: button vs. submit

[lordnick]

Hallo,

habe ein kleines Problem und komme mit der Suche im I-net auch nicht weiter.
Ich möchte ein Formular, dass beim abschicken nicht die komplette Seite neu läd sondern nur das Formular.

Habe folgendes Formular...

PHP-Code:

<form name="test">
      <input type="text" name="sende"><br />
      <input type="button" value="B1" onclick="form_weg()">
 </form> 


... das beim Klick auf den Button "B1" das onclick-Event ausführt. Funktioniert einwandfrei.

Drücke ich jedoch die Enter-Taste anstatt mit der linken Maustaste auf den Button zu klicken aktualisiert sich die Seite. type="submit" funktioniert dabei ja leider nicht

Was kann ich da tun bzw. weiß jemand nach was ich genau suchen kann?
Danke im Vorraus.
Gruß Nick.

[sonar]

Gib dem Formular selber nen onsubmit-Handler:

<form name="test" onsubmit="formular_weg(); return false;">
...
</form>

Dann kannst auch nen normalen Submit-Button verwenden.

[lordnick]

Hi,

das hatte ich schon versucht und bin gescheitert weil ich das

PHP-Code:

return false; 


vergessen hatte... (danach kam nur noch holzweg) Nun gehts aber. Dickes danke

[sonar]

Das braucht man, weil man ja das Standardverhalten des Elements unterdrücken möchte.

[Clubnite]

Also bei mir funktioniert das nicht.

PHP-Code:

<form action="index.php" method="post" id="f-test" onsubmit="submitForm(this); return false;">
   ...
   <input type="submit" class="round" id="btn-test" name="" value="SAVE" onclick="return this.form.submit();">
   ...
</form> 


Das Formular wird immer klassisch abgeschickt und meine JS-Funktion

PHP-Code:

function submitForm(form) {
   throw 'angekommen';
   return false;
} 


kommt nicht zur Ausführung.

[thomas_E]

onclick="return this.form.submit();"

afaik kann mann keinen submit abfangen, der mit Javascript ausgelöst wurde.
=> lass den o.g. Code weg! er ist unsinnig in einem Submit-Button.

[Clubnite]

Den hab ich ja erst dazugeschrieben, weil es allein mit dem Eventhandler auf dem Formular zu eben dem Problem kommt, dass es dennoch abgeschickt wird. Es spielt also keine Rolle, ob auf dem Button ein Handler liegt. So oder so, wird es bei einer Lösung der Art 'onEvent....' immer klassisch abgeschickt. Erst mit einer Anweisung über ein JS-Framework, das Standardevent nicht auszulösen, konnte ich das Problem lösen.

Ich frage mich, wass ich i.Vgl. zu lordnick anders mache.

[thomas_E]

Ich frage mich, wass ich i.Vgl. zu lordnick anders mache.

throw 'angekommen';

throw ist dazu da Error-Objekte zu schmeissen.
Die weitere Abarbeitung des Codes wird übersprungen, bis der Fehler von einem try-catch-block aufgefangen wird. (scheinbar auch dann, wenn du kein Error schmeisst, sondern lediglich einen String)

damit wird bei dir auch kein "return false" ausgeführt.

versuch mal folgenden code:

<script type="text/javascript">
	function __checkSubmit(target){
		if(!target.cnt) target.cnt = 0;
		if(!target.comment) target.comment = target.appendChild(document.createTextNode(''));
		target.comment.nodeValue = 'Das war click nr ' + (++target.cnt);
		
		return false;
	}
</script>

<form action="#" method="GET" onsubmit="return __checkSubmit(this);">
	<input type="submit" />
</form>

[Clubnite]

throw ist dazu da Error-Objekte zu schmeissen.
Die weitere Abarbeitung des Codes wird übersprungen, bis der Fehler von einem try-catch-block aufgefangen wird. (scheinbar auch dann, wenn du kein Error schmeisst, sondern lediglich einen String)

Wieder was gelernt.

Dein Beispielcode funktioniert. Danke für die wertvollen Hinweise!