2016-08-03 11 views
1

Ich versuche, eine eMail über AJAX einzureichen, aber aus irgendeinem Grund funktioniert nichts. Ich habe Zähler und Zähler überprüft, dass die Dateien (<script src="mail.js"></script>, jquery und url: "sendmail.php") gut zugeordnet sind.Submision über AJAX Anruf funktioniert nicht

Die Seite wird neu geladen und nichts wird gesendet. Ich möchte nicht, dass irgendeine Seite zuerst neu geladen wird, der Grund, warum ich AJAX verwende.

Was mache ich falsch? Vielen Dank im Voraus.

index.html

<!DOCTYPE html> 
<html lang="en"> 

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

<body> 

    <!-- Content --> 
    <div class="container"> 
     <div class="row"> 
      <div class="span12 subscribe"> 
       <h3>Subscribe to our newsletter</h3> 
       <p>Sign up now to our newsletter and you'll be one of the first to know when the site is ready:</p> 
       <form class="form-inline" action="" method="post"> 
        <input type="text" name="tasktitle" placeholder="Enter your email..."> 
        <button type="submit" class="btn">Subscribe</button> 
       </form> 
       <div class="success-message"></div> 
       <div class="error-message"></div> 
      </div> 
     </div> 
    </div> 

</body> 

</html> 

mail.js

$(document).ready(function(){  

    $('.btn').click(function(e){ 

    var current_time = 123; 
    var tasktitle = $("input#tasktitle").val(); 
    var dataString = 'current_time='+ current_time + '&tasktitle=' + tasktitle; 

    $.ajax({ 
     type: "POST", 
     url: "sendmail.php", 
     data: dataString, 

     success: function() { 
     $('.title').html(""); 
     $('.success-message').html("✓ Logged!") 
     .hide() 

     .fadeIn(1500, function() { 
      $('success-message').append(""); 
     }); 
     } 
    }); 
    return false; 

    }); 
}); 

sendmail.php

ich habe bereits das Verzeichnis CCTS für die Datei in geschrieben werden.

<?php 
$tasktitle = $_POST['tasktitle']; 
setlocale(LC_TIME, "fi_FI"); 
date_default_timezone_set("Europe/Helsinki"); 
$date = strftime("%Y-%m-%d-%A"); 
$timesaved = strftime("%H:%M:%S"); 
$elapsedtime = $_POST['current_time']; 
$file = "ccts/".$date.".txt"; 
$cont = 'time submitted: '.$timesaved.' - time elapsed: '.$elapsedtime.' - Email Address http://onvill.com/ : '.$tasktitle.''. "n"; 



function isEmail($email) { 
    return(preg_match("/^[-_.[:alnum:]][email protected]((([[:alnum:]]|[[:alnum:]][[:alnum:]-]*[[:alnum:]])\.)+(ad|ae|aero|af|ag|ai|al|am|an|ao|aq|ar|arpa|as|at|au|aw|az|ba|bb|bd|be|bf|bg|bh|bi|biz|bj|bm|bn|bo|br|bs|bt|bv|bw|by|bz|ca|cc|cd|cf|cg|ch|ci|ck|cl|cm|cn|co|com|coop|cr|cs|cu|cv|cx|cy|cz|de|dj|dk|dm|do|dz|ec|edu|ee|eg|eh|er|es|et|eu|fi|fj|fk|fm|fo|fr|ga|gb|gd|ge|gf|gh|gi|gl|gm|gn|gov|gp|gq|gr|gs|gt|gu|gw|gy|hk|hm|hn|hr|ht|hu|id|ie|il|in|info|int|io|iq|ir|is|it|jm|jo|jp|ke|kg|kh|ki|km|kn|kp|kr|kw|ky|kz|la|lb|lc|li|lk|lr|ls|lt|lu|lv|ly|ma|mc|md|mg|mh|mil|mk|ml|mm|mn|mo|mp|mq|mr|ms|mt|mu|museum|mv|mw|mx|my|mz|na|name|nc|ne|net|nf|ng|ni|nl|no|np|nr|nt|nu|nz|om|org|pa|pe|pf|pg|ph|pk|pl|pm|pn|pr|pro|ps|pt|pw|py|qa|re|ro|ru|rw|sa|sb|sc|sd|se|sg|sh|si|sj|sk|sl|sm|sn|so|sr|st|su|sv|sy|sz|tc|td|tf|tg|th|tj|tk|tm|tn|to|tp|tr|tt|tv|tw|tz|ua|ug|uk|um|us|uy|uz|va|vc|ve|vg|vi|vn|vu|wf|ws|ye|yt|yu|za|zm|zw)$|(([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5])\.){3}([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5]))$/i", $email)); 
} 

if($_POST) { 

    // Enter the email where you want to receive the notification when someone subscribes 
    $emailTo = '[email protected]'; 

    $subscriber_email = ($_POST['tasktitle']); 

    if(!isEmail($subscriber_email)) { 
     $array = array(); 
     $array['valid'] = 0; 
     $array['message'] = 'Insert a valid email address!'; 
     echo json_encode($array); 
    } 
    else { 
     $f = fopen ($file, 'w'); 
     fwrite($f, $cont); 
     fclose($f); 

     $array = array(); 
     $array['valid'] = 1; 
     $array['message'] = 'Thanks for your subscription!'; 
     echo json_encode($array); 

     // Send email 
     $subject = 'New Subscriber!'; 
     $body = "You have a new subscriber!\n\nEmail: " . $subscriber_email; 
     // uncomment this to set the From and Reply-To emails, then pass the $headers variable to the "mail" function below 
     //$headers = "From: ".$subscriber_email." <" . $subscriber_email . ">" . "\r\n" . "Reply-To: " . $subscriber_email; 
     mail($emailTo, $subject, $body); 
    } 

} 

?> 

UPDATE

bekomme ich den Fehler:

Uncaught ReferenceError: $ is not defined(anonymous function) @ mail.js:1 
+0

Check-in-Konsole, wenn Ajax-Aufruf funktioniert oder nicht –

+0

ich den Fehler: \t 'Uncaught ReferenceError: $ ist nicht definiert (anonym ous Funktion) @ mail.js: 1' –

Antwort

1

HTML-Code

<!DOCTYPE html> 
<html lang="en"> 

<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script src="mail.js"></script> 
</head> 

<body> 

    <!-- Content --> 
    <div class="container"> 
     <div class="row"> 
      <div class="span12 subscribe"> 
       <h3>Subscribe to our newsletter</h3> 
       <p>Sign up now to our newsletter and you'll be one of the first to know when the site is ready:</p> 
       <form class="form-inline" action="" method="post"> 
        <input type="text" name="tasktitle" placeholder="Enter your email..."> 
        <button type="submit" class="btn">Subscribe</button> 
       </form> 
       <div class="success-message"></div> 
       <div class="error-message"></div> 
      </div> 
     </div> 
    </div> 

</body> 

</html> 

in mail.js

$(document).ready(function(){  

    $('.btn').click(function(e){ 

    var current_time = 123; 
    var tasktitle = $("input#tasktitle").val(); 
    var dataString = 'current_time='+ current_time + '&tasktitle=' + tasktitle; 

    $.ajax({ 
     type: "POST", 
     url: "sendmail.php", 
     data: $("form.form-inline").serialize(), 
     dataType:'json', 
     success: function(data) { 
     if(data.type=="success") 
     { 
      $('.title').html(""); 
      $('.success-message').html("✓ Logged!") 
      .hide() 

      .fadeIn(1500, function() { 
       $('success-message').append(""); 
      }); 
     } 
     else 
     { 
      alert(data.message); 
     } 
     } 
    }); 
    return false; 

    }); 
}); 

in PHP-Datei

<?php 

$response=array(); 

if(!empty($_POST)) 
{ 
    $tasktitle = $_POST['tasktitle']; 
    setlocale(LC_TIME, "fi_FI"); 
    date_default_timezone_set("Europe/Helsinki"); 
    $date = strftime("%Y-%m-%d-%A"); 
    $timesaved = strftime("%H:%M:%S"); 
    $elapsedtime = $_POST['current_time']; 
    $file = "ccts/".$date.".txt"; 
    $cont = 'time submitted: '.$timesaved.' - time elapsed: '.$elapsedtime.' - Email Address http://onvill.com/ : '.$tasktitle.''. "n"; 

    function isEmail($email) { 
     return(preg_match("/^[-_.[:alnum:]][email protected]((([[:alnum:]]|[[:alnum:]][[:alnum:]-]*[[:alnum:]])\.)+(ad|ae|aero|af|ag|ai|al|am|an|ao|aq|ar|arpa|as|at|au|aw|az|ba|bb|bd|be|bf|bg|bh|bi|biz|bj|bm|bn|bo|br|bs|bt|bv|bw|by|bz|ca|cc|cd|cf|cg|ch|ci|ck|cl|cm|cn|co|com|coop|cr|cs|cu|cv|cx|cy|cz|de|dj|dk|dm|do|dz|ec|edu|ee|eg|eh|er|es|et|eu|fi|fj|fk|fm|fo|fr|ga|gb|gd|ge|gf|gh|gi|gl|gm|gn|gov|gp|gq|gr|gs|gt|gu|gw|gy|hk|hm|hn|hr|ht|hu|id|ie|il|in|info|int|io|iq|ir|is|it|jm|jo|jp|ke|kg|kh|ki|km|kn|kp|kr|kw|ky|kz|la|lb|lc|li|lk|lr|ls|lt|lu|lv|ly|ma|mc|md|mg|mh|mil|mk|ml|mm|mn|mo|mp|mq|mr|ms|mt|mu|museum|mv|mw|mx|my|mz|na|name|nc|ne|net|nf|ng|ni|nl|no|np|nr|nt|nu|nz|om|org|pa|pe|pf|pg|ph|pk|pl|pm|pn|pr|pro|ps|pt|pw|py|qa|re|ro|ru|rw|sa|sb|sc|sd|se|sg|sh|si|sj|sk|sl|sm|sn|so|sr|st|su|sv|sy|sz|tc|td|tf|tg|th|tj|tk|tm|tn|to|tp|tr|tt|tv|tw|tz|ua|ug|uk|um|us|uy|uz|va|vc|ve|vg|vi|vn|vu|wf|ws|ye|yt|yu|za|zm|zw)$|(([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5])\.){3}([0-9][0-9]?|[0-1][0-9][0-9]|[2][0-4][0-9]|[2][5][0-5]))$/i", $email)); 
    } 

    // Enter the email where you want to receive the notification when someone subscribes 
    $emailTo = '[email protected]'; 

    $subscriber_email = ($_POST['tasktitle']); 

    if(!isEmail($subscriber_email)) { 
     $response['type'] = 'error'; 
     $response['message'] = 'Insert a valid email address!'; 
    } 
    else { 
     $f = fopen ($file, 'w'); 
     fwrite($f, $cont); 
     fclose($f); 

     $array = array(); 
     $array['valid'] = 1; 
     $array['message'] = 'Thanks for your subscription!'; 
     echo json_encode($array); 

     // Send email 
     $subject = 'New Subscriber!'; 
     $body = "You have a new subscriber!\n\nEmail: " . $subscriber_email; 
     // uncomment this to set the From and Reply-To emails, then pass the $headers variable to the "mail" function below 
     //$headers = "From: ".$subscriber_email." <" . $subscriber_email . ">" . "\r\n" . "Reply-To: " . $subscriber_email; 
     mail($emailTo, $subject, $body); 
     $response['type'] = 'success'; 
     $response['message'] = 'Mail sent successfully!'; 
    } 

} 
else 
{ 
    $response['type'] = 'error'; 
    $response['message'] = 'Invalid post request'; 
} 
ob_clean(); 
echo json_encode($response); 
+0

@ Program-Me-Rev, haben Sie Fragen zu dem, was ich getan habe? Wenn ja, bin ich hier für eine Erklärung. –

0

Dies liegt daran, die Sequenz:

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

Ihre mail.js ist oben und jquery danach . Aber in mail.js verwenden Sie $, und $ ist dort nicht verfügbar. Ändern Sie die Sequenz und versuchen Sie es erneut.

0

importieren nur jquery CDN vor Ihrer mail.js

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

jquery muss vor dem Aufruf geladen werden.