Jquery Post-Methode und Redirect nach Erfolg

Question

Ich versuche, eine Post-Methode mit jquery zu machen. Ich benutze es in einer Form und mit bootstravalidator um es zu validieren. Nach erfolgreicher Validierung wird das Formular veröffentlicht und der PHP wird aktiv. Jetzt versuche ich nach erfolgreicher Post eine Umleitung auf eine andere Seite zu machen. Hier ist der Code:

$('#buy').click(function() { 
$.post('php/text.php', $('form#order').serialize(), function() {window.location.href = "index.html";}); 
}); 

ich mehrere Versuche versucht, aber kann nicht die window.location.href = "index.html"; richtig bekommen. Entweder wird die Form auch bei fehlerhafter Validierung umgeleitet, oder es passiert nichts überhaupt ....

Ich finde es seltsam, weil 'php/text.php', $('form#order').serialize()' nur in Aktion bekommt, wenn die Validierung korrekt ist ...

EDIT:

Ich verwende auch Bootstrapvalidator um das Formular zu validieren. Die Validierung funktioniert perfekt und die Post-Methode wird ausgeführt, wenn alles ok ist.

Bootstrapvalidator:

$(document).ready(function() { 
     var validator = $('#order').bootstrapValidator({ 
      fields: { 
       email : { 
        message : "write email adress", 
        validators : { 
         notEmpty : { 
          message : "Show Email adress" 
         }, 
         stringLength : { 
          min : 6, 
          max: 35, 
         } 
        } 
       }, 
      } 
     }); 
     }); 

EDIT2:

HTML:

<form id="order"> 
    <input type="text" name="name"/><br> 
    <input type="text" name="email"/><br> 
    <textarea name="comment"></textarea><br> 
    <button type="submit" name="send" id="buy">Send</button> 
</form> 

Answer 1

Sie Formular abgeschickt wird, wenn Sie auf die Schaltfläche #buy klicken, und auch wenn Ihr JavaScript-Code läuft, Die Seite wird aktualisiert. Wenn Sie die Übermittlung des Formulars deaktivieren möchten, können Sie $(form).on('submit', function() { return fase; }) verwenden.

Dies ist der aktualisierte Code:

$('#order').on('submit', function() { 
    $.post('php/text.php', 
      $('form#order').serialize(), 
      function() { 
       window.location.href = "index.html"; 
      } 
    ); 
    return false; 
}); 

aktualisiert

Da Sie den bootstrapvalidator verwenden, sollten Sie das Plugin für den Prozess als auch einreichen (das Plugin hat eine submitHandler Funktion, die Sie verwenden sollen)

Dies ist der aktualisierte Code des Prüfers:

$(document).ready(function() { 
    var validator = $('#order').bootstrapValidator({ 
     fields: { 
      email : { 
       message : "write email adress", 
       validators : { 
        notEmpty : { 
        message : "Show Email adress" 
        }, 
        stringLength : { 
         min : 6, 
         max: 35, 
        } 
       } 
      }, 
     }, 
     submitHandler: function(validator, form, submitButton) { 
      $.post('php/text.php', 
       form.serialize(), 
       function() { 
        window.location.href = "index.html"; 
       } 
      ); 
    }); 
}); 

Answer 2

Ich glaube, du hast etwas falsch gemacht.

Ich bin mir nicht sicher, was Sie mit "bootstrapvalidator" meinen. Bootstrap selbst bietet keine Validierung, nur visuelle Anzeige von ansonsten validierten Formularelementen.

Der Code, den Sie geschrieben haben, führt keine "Validierung" durch.

Diese $('form#order').serialize() serialisiert Ihr Formular und enthält nur "erfolgreiche" Formularelemente (siehe https://api.jquery.com/serialize/ und https://www.w3.org/TR/html401/interact/forms.html#h-17.13.2 für die Definition von "erfolgreich"). Alle anderen Formularelemente werden weggelassen, was zu einem leeren String führt, wenn alle Formularelemente nicht "erfolgreich" sind.

Wie auch immer, dieser String wird (unbedingt) der $.post()-Methode zugeführt, so dass die POST-Anfrage immer ausgeführt wird. Wenn die POST-Anfrage erfolgreich ist (was einen Statuscode von 2xx oder 304 bedeutet), wird Ihr Erfolgshandler mit der Weiterleitung ausgeführt.

Also, Ihr Ziel zu erreichen, haben Sie irgendeine Art von Bestätigung Ihrer Form zu tun vor die POST-Anforderung senden. Sie können dies entweder manuell tun oder nur eines der jquery- oder bootstrap-Plugins verwenden, die für die Formularvalidierung erstellt wurden.

Answer 3

fand ich eine Lösung

 $(document).ready(function() { 
      var validator = $('#order').bootstrapValidator({ 
        fields: { 
         email : { 
          message : "write email adress", 
          validators : { 
           notEmpty : { 
            message : "Show Email adress" 
           }, 
           stringLength : { 
            min : 6, 
            max: 35, 
           } 
          } 
         }, 
        } 
       }).bootstrapValidator('validate'); 
       }); 

     $(#button).click(function() { 
      var validator = $('#order').bootstrapValidator({ 
        fields: { 
         email : { 
          message : "write email adress", 
          validators : { 
           notEmpty : { 
            message : "Show Email adress" 
           }, 
           stringLength : { 
            min : 6, 
            max: 35, 
           } 
          } 
         }, 
        } 
       }).bootstrapValidator('validate'); 
      var isValid = true; 
      if($('#order').find('div.has-error').length > 0){ 
      isValid = false; 
      }; 
      if (isValid == true){ 
       $.post('php/text.php', $('form#order').serialize()); 
       $(location).attr('href','success.html');; 
      }; 
      }); 
     });