ajax und javascript Felder auslesen ohne Post absenden

[1UnitedPower]

Hakuna matata!

Ich bräuchte nun nur eigentlich das Auslesen von eingetragenen Werte in Formularfelder um dann mit diesen die Ajax-Ausführung zu starten.

Dafür gibt es seit HTML5 die FormValidation-API, das macht es extrem einfach für dich. Du musst den Formular-Eingabefeldern lediglich die richtigen Attribute verpassen, zum Beispiel:

<input type="number"> für ein numerisches Eingabefeld, oder <input required> für ein Pflichtfeld.

Mit HTML5-FormValidation und AJAX ergibt sich dann folgendes Grundgeürst (ungetestet):

// AJAX-Request vorbereiten  
var request = new XMLHttpRequest();  
request.open('post','action.php');  
  
// Referenz auf das <form>-Element holen  
var form = document.querySelector('form');  
  
// Event-Handler für das submit-Ereignis registrieren  
form.addEventListener('submit', function ( submitEvent ) {  
  
   // Standard-Verhalten unterdrücken  
   submitEvent.preventDefault();  
  
   // Formuardaten überprüfen und Feedback an den Nutzer geben  
   var isValid = submitEvent.target.reportValidity();  
  
   // Im Erfolgsfall Formular abschicken  
   if ( isValid ) {  
  
      // Formulardaten auslesen  
      var formData = new FormData( submitEvent.target );  
  
      // Formulardaten mit AJAX abschicken  
       request.send( formData );  
  
   } else {  
  
      // Fehlerbehandlung  
   }  
  
});