"Senden erfolgreich" wird auf andere Seite angezeigt

  • Hey Leute,

    folgendes Problem: Nachdem man das Kontaktfeld ausfüllt und auf senden klickt, wird die Benachrichtigung dass die Nachricht abgeschickt wurde, auf einer extra Seite geöffnet. Was ich nicht verstehe da ich das Kontakt-Formular und die php und js Dateien aus einer anderen Webseite (welches ein bekannter von mir programmiert hat, wo es auch funktioniert) kopiert habe, ich habe auch kontrolliert ob alles richtig verlinkt, im richtigen Ordner und auch auf dem richtigen Platz ist. An den Codes an sich habe ich nur die E-Mail Adresse und die Namen geändert, sonst nichts. Nach stundenlangem suchen und rum probieren finde ich leider das Problem nicht.


    Hier die Codes:


    html:

    Code
    1. <form id="contact-form" action="assets/php/contact.php" method="post"> <div class="messages"></div> <div class="controls"> <div class="form-row"> <div> <div class="form-group"> <label class="d-xl-flex justify-content-xl-end" for="form_name"></label> <input class="form-control" type="text" id="form_name" data-error="Name erforderlich." name="name" required="" placeholder="Dein Name"> <div class="help-block with-errors"></div> </div> </div> </div> </div> <div class="form-row"> <div> <div class="form-group"> <label class="d-xl-flex justify-content-xl-end" for="form_email"></label> <input class="form-control" type="email" id="form_email" data-error="E-Mail erforderlich." name="email" required="" placeholder="Deine Mail"> <div class="help-block with-errors"></div> </div> </div> </div> <div class="form-row"> <div> <div class="form-group"> <label class="d-xl-flex justify-content-xl-end" for="form_phone"></label> <input class="form-control d-xl-flex justify-content-xl-start" type="text" id="form_subject" data-error="Betreff erforderlich." name="subject" required="" placeholder="Dein Thema (Betreff)"> <div class="help-block with-errors"></div> </div> </div> </div> 
    2. <div class="form-row"> <div> <div class="form-group"> <label class="d-xl-flex justify-content-xl-end" for="form_message"></label> <textarea class="form-control d-xl-flex justify-content-xl-start" type="text" id="form_message" data-error="Nachricht erforderlich." rows="8" name="message" required="" placeholder="Dein Anliegen"></textarea> <div class="help-block with-errors"></div> </div> </div> </div> <br> <div class="form-row"> <button class="btn btn-success btn-send submit" value="Senden" type="submit">senden</button> </div> </form>

    Der php-code:


    PHP
    1. <?php/** CONFIGURE EVERYTHING HERE */// an email address that will be in the From field of the email.$from = 'Kontaktform KdB <[email=contactform@kulturderbewegung.de]contactform@kulturderbewegung.de[/email]>'; [i](das hier ist einer der veränderten codes)[/i]// an email address that will receive the email with the output of the form$sendTo = 'KDB Kontakt <[email=office@conweimar.de]office@conweimar.de[/email]>';[i] (das hier ist einer der veränderten codes)[/i]// subject of the email$subject = 'KdB Kontaktformular'; [i](das hier ist einer der veränderten codes)[/i]// form field names and their translations.// array variable name => Text to appear in the email$fields = array('name' => 'Name', 'email' => 'Email', 'subject' => 'Betreff', 'message' => 'Nachricht'); // message that will be displayed when everything is OK :)$okMessage = 'Wir haben deine Anfrage erhalten! Wir melden uns schnellstmöglich bei dir.';// If something goes wrong, we will display this message.$errorMessage = 'Es ist ein Fehler aufgetreten . Bitte später erneut versuchen';/* * LET'S DO THE SENDING */// if you are not debugging and don't need error reporting, turn this off by error_reporting(0);error_reporting(E_ALL & ~E_NOTICE);try{ if(count($_POST) == 0) throw new \Exception('Form is empty'); $emailText = "Neue Kontaktanfrage\n=============================\n"; foreach ($_POST as $key => $value) { // If the field exists in the $fields array, include it in the email if (isset($fields[$key])) { $emailText .= "$fields[$key]: $value\n"; } } // All the neccessary headers for the email. $headers = array('Content-Type: text/plain; charset="UTF-8";', 'From: ' . $from, 'Reply-To: ' . $from, 'Return-Path: ' . $from,); // Send email mail($sendTo, $subject, $emailText, implode("\n", $headers)); $responseArray = array('type' => 'success', 'message' => $okMessage);}catch (\Exception $e){ $responseArray = array('type' => 'danger', 'message' => $errorMessage);}// if requested by AJAX request return JSON responseif (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') { $encoded = json_encode($responseArray); header('Content-Type: application/json'); echo $encoded;}// else just display the messageelse { echo $responseArray['message'];}

    1. JS Code:


    Code
    1. $(function () { $('#contact-form').validator(); $('#contact-form').on('submit', function (e) { if (!e.isDefaultPrevented()) { var url = "assets/php/contact.php"; $.ajax({ type: "POST", url: url, data: $(this).serialize(), success: function (data){ var messageAlert = 'alert-' + data.type; var messageText = data.message; var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + messageText + '</div>'; if (messageAlert && messageText) {$('#contact-form').find('.messages').html(alertBox); $('#contact-form')[0].reset(); }}}); return false; }})});

    Danke schonmal im voraus!

  • habe jetzt nur kurz reingeschaut.

    Ich würde in der Html Datei mal das action löschen

    Code
    1. <form id="contact-form" action="assets/php/contact.php" method="post">

    in so

    Code
    1. <form id="contact-form" method="post">

    Wenn ich deinen Code richtig verstanden habe sendest du den submit mit Javascript ab.

    Wenn es nicht geht muß ich das mal genauer testen.

  • Also ich habe den action="assets/php/contact.php" Code entfernt. Die zweite Seite öffnet sich nicht mehr, aber dafür bekommt man gar keine Benachrichtigung ob es überhaupt abgeschickt wurde und die Nachricht kommt bei mir jetzt leider nicht mehr an.

  • Wie ich sehe, benutzt das Javascript jQuery und einen Validator. Möglicher Weise ist der Grund, dass Du auf die neue Seite gelangst, dass Du jQuery nicht eingebunden hast. Binde es ein, frage deinen Bekannte, welcher Validator das ist und binde diesen ebenfalls ein.


    BTW: Du hast zwar erfreulicher Weise Codetags benutzt aber irgend wie ist mit dem Code etwas falsch gelaufen, weil die Zeilenumbrüche fehlen.

  • Hey,


    ich probiere es mal aus mit dem Affenformular.


    Wieso die Zeilenumbrüche fehlen versteh ich selber nicht, die Codes habe ich direkt aus dem Visual Studio Code kopiert und hier eingefügt.


    Ja das ist die Webseite an der ich arbeite.

  • Auf kulturbewegung.de fehlen auch die Zeilenumbrüche, vor ein paar Tagen war das noch nicht der Fall. Möglicher Weise hast Du in VS-Code etwas verstellt?

    Hast Du mal eine Blick in die Console geworfen? Dort werden einige Fehler angezeigt. Der Grund ist, dass Du jQuery mehrfach eingebunden hast und dass die Reihenfolge nicht stimmt.

    So wäre es richtig:

  • Hey,


    ich merke erst jetzt das die Zeilenumbrüche fehlen weil ich größere Code-Dateien minimiert habe um es für die Online-Version benutzen, damit die Datei-Größe der Webseite an sich nicht so groß ist. Ich habe aber noch die nicht minimierte Version um die Webseite bearbeiten zu können.


    Danke für die Antwort! Ich wusste gar nicht dass man eine bestimmte Reihenfolge einhalten muss und es auch deswegen nicht funktionieren kann, ich probiers mal aus.

  • Also ich habe die Reihenfolge geändert und noch einen cdn-Link eingefügt


    den /jquery-validate (Zeile 6) habe ich eingefügt. Das soll eine alternative sein wenn ich nicht den entsprechenden Link finde. Also jetzt ist es so dass sich das Kontaktformular zwar leer wenn man auf senden klickt, aber die Nachricht kommt bei mir immer noch nicht an.

  • Am besten den geänderten Stand mit Zeilenumbrüchen hoch laden, damit man es sich in Aktion ansehen kann.


    Hat denn das Versenden zuvor funktioniert, als noch eine neue Seite geladen wurde?


    Ich hatte mir das früher angesehen und dieses:

    Code
    1. <script src="assets/js/PHP-Contact-Form-dark.js"></script>
    2. <script src="assets/js/PHP-Contact-Form-dark-1.js"></script>

    schienen mir die Javascripts für das Abschicken des Formulars und die Validierung zu sein.

    d. h. Zeile 6 ist wahrscheinlich entbehrlich.


    Und Zeile 17 löschen, das jQuery muss ganz am Anfang eingebunden sein und ist es auch in Zeile 1. Bindest Du es am Schluss ein, werden die Funktionen, die die anderen Skripts hinzu fügen, wieder gelöscht.

  • Ja, das versenden hat davor funktioniert.


    Hier der Code mit Zeilenumbrüchen

    Und noch den JS Code also PHP-Contact-Form-dark.js, den PHP-Contact-Form-dark-1.js kann ich hier leider nicht einfügen da dieser die Begrenzung von 10.000 Zeichen überschreitet.

  • Leider hast Du immer noch das Einbinden von jQuery ganz am Schluss drin:

    Code
    1. <script src="assets/js/PHP-Contact-Form-dark-1.js"></script>
    2. <!-- das folgende muss geloescht werden: -->
    3. <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    4. </body>
    5. </html>

    Wie oben schon geschrieben: Dadurch werden die durch die Skript hinzu gefügten Funktionen wieder gelöscht. Wirf einen Blick in die Console.

  • Eben ist bei mir eine Test-Mail angekommen, auch als ich es eben ausprobiert habe. Ich denke dadurch dass ich den

    Code
    1. <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

    entfernt habe funktioniert das Formular jetzt.


    Besten Dank für die Hilfe!