2017-11-19 5 views
0

Frage zu @ss Kontaktformular. Nach dem Absenden des Formulars sollte Bootstrap Popup mit einer Bestätigung angezeigt werden, aber anscheinend wird es nicht angezeigt.PHP modal nach dem Senden funktioniert nicht

Hier ist mein Code:

<?php 

if(isset($_POST['submit'])) {  
// EDIT THE 2 LINES BELOW AS REQUIRED 

$email_to = "[email protected]***.com"; 

// EDIT THE 2 LINES BELOW AS REQUIRED 
$sender = $_POST['email']; 

$name = $_POST['name']; // required 
$email = $_POST['email']; // required 
$object = $_POST['object']; 
$message = $_POST['message']; 


$email_message = "Form details below.\n\n"; 

$email_subject = "Contact details - $name"; 

function clean_string($string) { 
    $bad = array("content-type","bcc:","to:","cc:","href"); 
    return str_replace($bad,"",$string); 
} 

$email_message .= "Name: ".clean_string($name)."\n"; 
$email_message .= "Email: ".clean_string($email)."\n"; 
$email_message .= "object: ".clean_string($object)."\n"; 
$email_message .= "Message: ".clean_string($message)."\n"; 


// create email headers 
$headers = 'From:'.$sender."\r\n". 
'Reply-To: '.$email."\r\n" . 
'X-Mailer: PHP/' . phpversion(); 
$sent= @mail($email_to, $email_subject, $email_message, $headers); 

if($sent){ 
//   echo "<script>alert('Thank you for submitting your details, We will be in touch as per your request.') 
//   location.replace('contact.html') 
// </script>"; 
    echo "<script>$('#thankyouModal').modal('show')</script>"; 
} 
else { 
echo "<script>alert('Sorry! Something went wrong') 
     location.replace('contact.html') 
</script>"; 

    } 
} 
?> 

<html> 
    <head> 
    <title></title> 
    <!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 

<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 

    </head> 
    <body> 

<div class="modal fade" id="thankyouModal" tabindex="-1" role="dialog"> 
    <div class="modal-dialog" role="document"> 
    <div class="modal-content"> 
     <div class="modal-header text-center"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <h2 class="modal-title text-center" style="font-weight: 600;">Thank you for Contact Us!</h2> 
     </div> 
     <div class="modal-body text-center" style="background-color: #59ABE3;"> 
     <p style="font-weight: 600; color: #fff; font-size: 18px;">Thanks for getting in touch!</p> 
     </div> 
     <div class="modal-footer" style="background-color: #59ABE3; border-top: 0px solid #fff;"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
    </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
</div><!-- /.modal --> 

    </body> 
</html> 

Formular sendet mich durch die Absenden-Button cont.php und danach habe ich leere cont.php-Seite.

Ich hoffe, dass jemand die Antwort hat. Vielen Dank im Voraus Jungs!

+0

Javascripts sollte am Ende des Dokuments hinzugefügt werden, oder verwenden Sie '$ (document) .ready()' – gogaz

+0

Wo genau soll ich sagen @ Gogaz? – ZnortDesigns

+0

meinst du danke nachricht oder eine andere art von bestätigung? welcher ? –

Antwort

0

Versuchen Sie, Ihrem JS-Snippet (Dokument) .ready Funktion hinzuzufügen.

echo "<script> 
$(document).ready(function(){ 
$('#thankyouModal').modal('show'); 
}); 
</script>"; 

und bewegen diese ganze PHP-Skript vor </head> Tag, da Sie wollen Funktionen nicht aufrufen, bevor jQuery initialisiert wird.

Dann sollten Sie Ihre modal geladen haben:

Modal

+0

Danke für deine Zeit und klare Erklärung! Leider gibt mein Server jetzt einen Fehler von 500, aber ich werde es so schnell wie möglich überprüfen. – ZnortDesigns

+0

Überprüfen Sie Ihre error.log für 500 Fehler. – harisdev

+0

Datei existiert nicht, aber ich kann es in cPanels Dateimanager und über FTP sehen. – ZnortDesigns