2013-04-04 74 views
0

我有一個簡單的html聯繫表單,以及用於發送電子郵件的php腳本。它運行良好,但我希望結果(電子郵件已發送...)顯示在同一頁面中,而不更改頁面。我怎樣才能做到這一點?如何使用AJAX顯示聯繫人表單的PHP結果?

HTML:

<form name="contact" action="includes/send.php" id="contact_form"> 

    <input type="text" placeholder="Name" name="name" /> <br /> 

    <input type="email" placeholder="Email Address" name="email" /> <br /> 

    <textarea name="message" placeholder="Message" rows="8"></textarea> <br /> 

    <input type="submit" name="submit" id="submit_btn" value="Send" /> 

</form> 

PHP:

<?php 

$name = $_POST['name']; 
$email = $_POST['email']; 
$message = $_POST['message']; 

$to = '[email protected]'; 
$subject = 'Message from AMARSYLA.COM'; 
$message = 'FROM: '.$name.' Email: '.$email.'Message: '.$message; 
$headers = 'From: [email protected]'; 

if (filter_var($email, FILTER_VALIDATE_EMAIL)) { // this line checks that we have a valid email address 
    mail($to, $subject, $message) or die('Error sending Mail'); //This method sends the mail. 
    echo "Your email was sent!"; // success message 
} 

?> 
+0

您似乎在問一個Ajax 101教程。這不是那種適合Stackoverflow的問題。改爲使用搜索引擎(可以獲得諸如[此mdn資源](https://developer.mozilla.org/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest))的結果。 – Quentin 2013-04-04 13:37:58

+0

如果你只想這樣做,你不必使用Ajax,除非你不想在提交表單時刷新頁面。 – egig 2013-04-04 13:44:19

回答

0
jQuery.post('email.php', score, function(result) { 
    jQuery('#textBlock').html(result); 
}); 

類似的東西應該工作(結果是在這種情況下,你的PHP回聲)

一個優先停留方法把你的php結果編碼爲json,所以你在Javascript中有更多的控制權。

jQuery.post('email.php', score, function(result) { 
    if (result.result == true) { 
     jQuery('#textBlock').html(result.text); 
    } 
}); 

而在email.php:

$result['result'] = true; 
$result['text'] = 'Message has been sent'; 

header('Content-Type: application/json'); 
echo json_encode($result); 
-2

這裏看看,如果這個工程:

<form name="contact" action="**submit to same page**" id="contact_form"> 



<input type="submit" name="submit" id="submit_btn" value="Send" /> 

</form> 

那麼對於PHP(在同一頁作爲電子郵件形式)只需添加如果提交

<?php 
if(isset($_POST['submit'])){ 

run your email script, add javascript, etc. 
echo "Your email was sent!"; // success message 
} 


    } 
    ?> 
相關問題