Klaus: Problem bei Ajax-Aufruf über onSubmit?

Hallo,

ich habe ein Ajax-Request in einer Javascript-Funktion, die einmal über einen Submit-Button und Form onSubmit aufgerufen wird, oder über einen Button mit onClick.

Der Button mit OnClick führt die Funktion und den Ajax-Aufruf korrekt aus, der Aufruf über den onSubmit aber scheinbar nicht.
Die Javascript-Funktion wird zwar aufgerufen, was ich mit einem einfachen alert('test'); belegen konnte, aber nicht der Ajax-Aufruf und damit auch nicht das Ergebnis, das in meinem Test erstmal nur 'I was here' ausgeben soll.

Natürlich kann ich aus dem Submit-Button auch einfach einen normalen Button mit onClick machen, aber dann verliere ich bspw. die Funktionalität 'required' in den Input-Boxen.

Was mach ich falsch?

Hier die Javascript-Funktion:

  
function m_verw(aktion) {  
	suche = "";  
	if (aktion == "SUCHE") {  
		suche = document.suchform.sucheingabe.value;  
	}  
	var req = createXMLHttpRequest();  
  
	req.onreadystatechange = function() {  
		switch(req.readyState) {  
			case 0:  
			case 1:  
			case 2:  
			case 3: return;  
			case 4: break;  
		}  
		resulttext = req.responseText;  
		document.getElementById('ergebnis_content').innerHTML = resulttext;  
	}  
	req.open('get', '<?=$pfadhtml;?>/templates/toolbox/do_itnow.php?aktion=' + aktion + '&suche=' + suche);  
	req.send(null);  
	return false;  
}  

Und der HTML-Code:

  
<form name="suchform" method="post" action="#" onSubmit="m_verw('SUCHE');">  
<input class="button" type="button" value="Neuer Eintrag" onClick="m_verw('NEU');" />  
<input type="text" id="sucheingabe" name="sucheingabe" value="<?=$sucheingabe;?>" placeholder="Suche nach Name oder Nummer" required="required" />  
<input class="button" type="submit" value="Suchen" />  
</form>  

  1. Hallo Klaus,

    <form name="suchform" method="post" action="#" onSubmit="m_verw('SUCHE');">

      
    so wird nach dem Ausführen der Funktion "m\_verw" noch die Action ("#") ausgeführt, also die Seite neu geladen. Du kannst das unterdrücken, indem die im onsubmit noch ein "return false;" hinzufügst.  
      
    Wenn die Formularelement nur als GUI für das Script dienen, kannst das Form-Tag und den Submit-Knopf auch ganz weglassen.  
      
    Gruß, Jürgen  
    
    
    1. Hallo Jürgen,

      <form name="suchform" method="post" action="#" onSubmit="m_verw('SUCHE');">

      
      >   
      > so wird nach dem Ausführen der Funktion "m\_verw" noch die Action ("#") ausgeführt, also die Seite neu geladen. Du kannst das unterdrücken, indem die im onsubmit noch ein "return false;" hinzufügst.  
        
      das return false; habe ich doch in der Javascript-Funktion am Ende ausgeführt und daher hatte ich auch damit gerechnet, dass die action="#" erst gar nicht gestartet wird.  
        
      
      >   
      > Wenn die Formularelement nur als GUI für das Script dienen, kannst das Form-Tag und den Submit-Knopf auch ganz weglassen.  
        
      Wenn ich den Form-Tag und den Submit weglasse, funktionieren aber z.B. nicht mehr die required-Funktionen, oder?  
        
      Klaus
      
      1. Ergänzung:

        Ich habe anstelle von action="#" jetzt einfach action="javascript:return false;" geschrieben, jetzt funktioniert es so.

        Dennoch bin ich noch im Glauben, dass die Action eigentlich nicht ausgeführt werden sollte, wenn onSubmit ein 'false' zurückliefert.

      2. Hallo Klaus,

        <form name="suchform" method="post" action="#" onSubmit="m_verw('SUCHE');">

          
        
        > das return false; habe ich doch in der Javascript-Funktion am Ende ausgeführt und daher hatte ich auch damit gerechnet, dass die action="#" erst gar nicht gestartet wird.  
          
        dann muss da  
           onSubmit="return m\_verw('SUCHE');"  
        stehen. Der Aufruf einer Funktion "returned" nichts.  
          
        Gruß, Jürgen