ajax Formular-Validierung, bevor Sie Einreichen, wie?

Ich Tue, ajax, cross-domain-Anfrage zu meiner php-Seite auf dem server.
Ich bin Entsendung form von html über ajax an meine php Seite auf dem server.
Habe ein problem mit der Validierung im client-Seite.

Ich weiß nicht, wie zu tun ist: Validierung im client-Seite vor dem senden form.

html-Formular standard Formular, Buchung Eingabe-Felder: Vorname, Nachname, Nachricht....
Mein html-Formular auf der client-Seite:

<script type="text/javascript">

    var output = $('.nesa');

     $(document).ready(function(){
     $("#form1").submit(function (e) {
     e.preventDefault();

    $.ajax({
        url: 'http://www.example.com/form.php',
        crossDomain: true, //set as a cross domain requests
        type: 'post',
        data: $("#form1").serialize(),
        beforeSend: function (){
        //add spinner
         $('.spinner').append('<img id="animacija" src="spinnersmall.gif" alt="Loading" />');
                   },

        success: function (data) {
            $(".nesa").html(data);
            alert("sent " + data);

        },

        error: function(){

            output.text('Message is not sent!');

        }

    });
});

});

Wie die Validierung? Ich versuche code in beforeSend aber ohne Erfolg.
Oder vielleicht verwenden submitHandler?

Idee ist, wenn Benutzer klicken Sie auf submit, zu, dass die Validierung starten, und wenn nicht, zu sagen, "legen Sie Ihre E-Mail-Adresse". Wenn ich nun auf senden, es sendet Daten an server. Ich will, dass erste check input-Felder.

Dieser form ist die eigentliche Arbeit die übertragung der Daten zum server, sondern müssen nur herausfinden, wie die Validierung. Wohin Validierung in ajax-call?

Dank

InformationsquelleAutor user3788491 | 2014-09-27

1

Erstellen einer Funktion, Formular überprüfen, die Rückgabe true/false. Rufen Sie die Funktion einfach vor dem $.ajax. überprüfen Sie, ob return false ist dann wieder.. siehe das Beispiel unten...
```
if(!validateForm())
    return false;
```
InformationsquelleAutor Mohd. Shaukat Ali
0

Ersten, sind Sie tatsächlich mit einem AJAX-Formular?

Sie erklärte, dass Sie laden das Formular selbst über AJAX, aber schicken Sie es auch so? Es scheint mir, dass du versuchst, es zu senden, die HTML Weg. Können Sie Haken in die auf - Ereignis die send Taste, bevor Sie Sie senden das Formular. Jedoch, da der button Hinzugefügt, um die Seite zur Laufzeit, Sie müssen sich anmelden, wird die Veranstaltung zu document.
```
$(document).on('click', 'input[type=submit]', function() {
    //Validate form
    //Add error message on fail, and return
    //Else submit form via AJAX
});
```
In jedem Fall können Sie verwenden jQuery blur - Ereignis als alternative zu validieren jedes Feld, wenn der Benutzer springt zum nächsten. Man könnte sogar überprüfen jedes mal, wenn der Benutzer eine Taste drückt mit keypress.

InformationsquelleAutor danijar

Ich immer überprüfen Sie Sie rechts, bevor ich geben Sie diese in ein AJAX-call. Hier ist mein exampel

$('#form_nieuwsbrief').bind('submit',function(){
    var name = $('input[name=naamNieuwsbrief]').val();
    var email = $('input[name=emailNieuwsbrief]').val();

    var proceed = true;
    if (name==""){
        $('input[name=naamNieuwsbrief]').css({'border':'2px solid red'});
        proceed = false;
        }
    if (email==""){
        $('input[name=emailNieuwsbrief]').css({'border':'2px solid red'});
        proceed = false;
        }
    if(proceed == false){
        $("#msg").append("<div class='alert alert-danger' role='alert'>U bent informatie vergeten in te vullen.</div>");    
        setTimeout(function(){
            $('.alert').fadeOut(400, function(){
                $(this).remove();
                })
            ;},10000
        );
    }

    if(proceed == true){ //make the ajax call

Dies ist nur ein Beispiel für einen newsletter, dass nur Anfragen name und E-Mail. Aber das Prinzip ist das gleiche. Kurz bevor Sie einen ajax-Aufruf, erstellen die if-else-Anweisung mit einer variable, die du setzen, wenn etwas falsch ist. sonst kleben Sie es tot, er original-Validierung, damit Sie fortfahren können.

InformationsquelleAutor Dorvalla

0

Bitte überprüfen Sie die form vor dem senden von ajax-request. Wenn kein Fehler vorhanden ist dann ajax-request geschickt werden soll, sonst false zurück.
Das können Sie gerne tun:
```
 $("#form1").submit(function (e) {
     e.preventDefault();

    //Get the Login Name value and trim it
    var name = $.trim($('#name').val());

    //Check if empty of not
    if (name === '') {
        alert('Text-field is empty.');
        return false;
    }
});
```
Sehen Sie die demo Hier (http://jsfiddle.net/LHZXw/1/)

Können Sie auch eine Funktion onKeyup.
- Danke. Das ist einfach und seine Arbeit 🙂 Aber was bedeuten .trim? Ich weiß nicht login-name, den ich senden Sie einfach "name".
- Stripping whitespace-Zeichen beginnen und enden die von Ihnen eingegebenen Werte nicht verletzt. Verwenden Sie trim für die Felder, die der Benutzer eingeben können.
InformationsquelleAutor Vimal Baisla
0

Du bist schon Validierung der server über die Seite korrekt? Warum verwenden nicht Sie, die gleichen Validierungsregeln zu erscheinen wie Sie Ihre client-Seite via Ajax. Ich habe ein tutorial, wie zu tun:

http://michaelsoriano.com/how-to-ajax-validate-forms/

InformationsquelleAutor Michael Soriano

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.