AJAX-Anruf blockieren, was wäre die perferierte Lösung?

Question

Zunächst einmal, ja ich weiß, es ist nicht die beste Art von Frage. Aber ich bin nicht wirklich sicher, wonach ich suchen sollte, um Referenzen zu finden. Wenn jemand einen Hinweis dafür hätte, wäre ich auch dankbar. Ich denke, es wäre eine Art Pattern-/Anti-Pattern-Referenz, aber ich bin mir nicht sicher, welche Keywords verwendet werden, um diejenigen zu finden, die anwendbar sind.

Was ich derzeit vor mir habe, ist ein Formular, in das ein Benutzer Daten eingeben und einreichen muss. Bevor der Benutzer das Formular abschickt, möchte ich einige Daten überprüfen, die einen Back-End-Anruf erfordern. Um dies zu tun (und das Senden zu blockieren) verwende ich eine jQuery und $.getJSON/$.ajax, um die Daten zu holen. Ich überprüfe es auch später noch einmal, wenn ich die Daten verarbeite. Es geht nur darum, dem Benutzer Feedback für seine Eingaben zu geben.

Ich bin mir nicht sicher, wann immer mein aktueller Ansatz ein guter ist. Ich bin nicht sicher, wie ich die Übermittlung blockieren und die Daten überprüfen würde, die ich von dem Anruf erhalte, indem ich einen asynchronen Anruf benutze oder wann immer ich es auf diese Weise tun sollte. Eine andere Möglichkeit wäre, das Formular abzuschicken, die Daten zu überprüfen und den Benutzer mit Informationen darüber, was falsch ist, zurück zum Formular zu bringen. Der Nachteil wäre, dass eine "schwere" Last notwendig ist.

1. Also was könnte ich tun, um einen asynchronen AJAX-Aufruf zu verwenden, um die Übermittlung zu blockieren, bis ich die Daten verifiziert habe?
2. Soll ich das überhaupt tun, oder soll ich das Formular einfach einreichen und bestätigen/ablehnen, bevor ich es zur Bearbeitung einschicke?

bearbeiten deutlich zu machen, es kein Duplikat ist:

Hier ist die aktuelle Funktion Eingangswerte verwende ich vor einreichen zu überprüfen. Wie Sie sehen können, wird die Übertragung nur abgebrochen/unterbrochen, wenn ein Fehler festgestellt wird. Ich verwende $.ajax anstelle von $.getJSON, da es blockiert. Normalerweise sollte dies keine großen Auswirkungen haben, da die Abfrage ziemlich schnell ist und das würde wahrscheinlich "gut genug" funktionieren, aber ich denke, dass es möglich sein sollte, dies zu verbessern.

$("form").submit(function(event){ 
    abortSubmit = false; 

    telephonePattern = new RegEx("^[0-9, ,\\-,+]*$") 
    if(telephonePattern.test($("#inputTelephone").value) == false){ 
     abortSubmit = true; 
     $("#helptext").text("The telephone field contains invalid numbers"); 
    } 

    userExists = false; 

    $.ajax({ 
     url: "<url>", 
     dataType: "json", 
     async: false, 
     data: { user: $("#inputUsername").value } 
    }).done(
     function(json){ 
      userExists = json; 
     } 
    ) 

    if(userExists.length > 0){ 
     abortSubmit = true; 
     $("#helptext").text("That username already exists!"); 
    } 

    if(abortSubmit){ 
     return false; 
    } 
}); 

Answer 1

$('.foo').on('click', function(e) { 
    var validated_form = validateForm($(this).closest('form')); 

    if (!validated_form) { 
     e.preventDefault(); 
     // display validation messages, tooltips, etc 
    }; 
}); 

.foo die Taste

vorlegen zu sein ich nehme an, Sie eine Frontend Validierungsfunktion haben (in diesem Beispiel würde es genannt validateForm werden), die in Form jquery Aufgabe übernimmt. In diesem Fall sollte es entweder wahr (wenn alles in Ordnung ist) oder falsch (wenn die Dinge nicht in Ordnung sind) zurückgeben. Wenn die Dinge nicht in Ordnung sind, wird das Formular nicht übermittelt. Wenn sie in Ordnung sind, wird es das Formular senden

Wenn Sie unbedingt die Validierung auf dem Back-End, dann können Sie immer noch die preventDefault und senden Sie das Formular über AJAX, validieren Sie es, und senden Sie eine Antwort. Wenn das Formular in Ordnung war, könnten Sie dafür ein benutzerdefiniertes Ereignis auslösen und das Formular dann automatisch senden (indem Sie zuvor einen Ereignis-Listener für dieses spezifische Ereignis erstellen). Wenn das Formular nicht in Ordnung war, könnten Sie erneut ein benutzerdefiniertes Ereignis (ein anderes Ereignis) auslösen und die Validierungsnachrichten und Ähnliches anzeigen.