Formulare - clientseitige Validierung vor Submit ausführen

So können Sie in Formularen vor dem Submit die clientseitige Validierung der Formularfelder anstoßen.

Beispiel

Sie verwenden ein Weblication-Formular, das nach dem Absenden eine externe URL aufrufen soll. Dies bedeutet, dass die serverseitige Validierung der Daten seitens Weblication nicht mehr möglich ist, und die clientseitige Validierung nur noch eingeschränkt funktioniert.

Durch das Einbinden eines submit -Events können Sie den Zustand des Formulars vor dem Absenden überprüfen und bei Bedarf die clientseitige Validierung ausführen. 

Beispiel Editor
Beispiel Editor

Beispiel: Abfangen des onSumbit-Events und anstoßen der clientseitigen Validierung falls es Eingaben gibt die nicht validie sind.

/*

Das Formular muss über einen eindeutigen Selektor angesprochen werden können. 
In diesem Beispiel ist das das Attribut name="myFrom".

Um dies zu erreichen, kann das Formular über die Quelltextansicht bearbeitet werden, 
indem innerhalb des Formular-Items folgender Code eingetragen wird:
<wd:fragment name="formName" type="char.default">myForm</wd:fragment>

*/

jQuery(document).ready(function(){
  
  /*Abfangen des Submit-Events*/
  jQuery('form[name=myForm]').attr({onclick:'', type: 'submit'}).on('click', function(event){
    
    if(jQuery('*[data-isinvalid=1]').length > 0){

      /*Formular enthält invalide Eingaben und submit abgebrochen*/
      jQuery('*[data-isinvalid=1]').each(function(i){
        
        /*clientseitige Validierung wird angestoßen*/
        wglValidateElementInline(jQuery(this), {});
      });
      return false;
    }
    else {

      /*Formular ist valide, submit wird ausgeführt*/
      return true;
    }

  });
});