2015-04-04 56 views
0

所以我需要實現一個AJAX信息提交表單。我正在使用由樹屋的傢伙構建的這個示例... http://blog.teamtreehouse.com/create-ajax-contact-formAJAX聯繫表 - 添加字段+多個表格一頁

問題的第一部分...如何添加新字段?我試着編輯.php .js和.html,讓它們全部符合我認爲正確的內容,但在測試我的解決方案時失敗。

我需要的字段... 名稱: 位置: 郵編: URL鏈接: 留言(200個字以內): 出生日期

第二部分......我可以上運行兩個的這些同一頁?

提前喝彩幫忙! - 如果你要我送代碼,你可以給我發電子郵件[email protected]

下面的代碼 -

   <form id="ajax-contact" method="post" action="mailer.php"> 

       <div class="field"> 
       <label for="name">Name:</label> 
       <input type="text" id="name" name="name" required> 
       </div> 

       <div class="field"> 
       <label for="email">Email:</label> 
       <input type="email" id="email" name="email" required> 
       </div> 

       <div class="field"> 
       <label for="link">Link:</label> 
       <input type="text" id="link" name="link" required> 
       </div> 


       <div class="field"> 
       <label for="message">Message:</label> 
       <textarea id="message" name="message" required></textarea> 
       </div> 

       <div class="field"> 
       <button type="submit">Send</button> 
       </div> 

       </form>  

JS

$(formMessages).text(response); 
     // Clear the form. 
     $('#name').val(''); 
     $('#email').val(''); 
     $('#link').val(''); 
     $('#message').val(''); 
    }) 
    .fail(function(data) { 
     // Make sure that the formMessages div has the 'error' class. 
     $(formMessages).removeClass('success'); 
     $(formMessages).addClass('error'); 

PHP

<?php 
// My modifications to mailer script from: 
// http://blog.teamtreehouse.com/create-ajax-contact-form 
// Added input sanitizing to prevent injection 

// Only process POST reqeusts. 
if ($_SERVER["REQUEST_METHOD"] == "POST") { 
    // Get the form fields and remove whitespace. 
    $name = strip_tags(trim($_POST["name"])); 
      $name = str_replace(array("\r","\n"),array(" "," "),$name); 
    $email = filter_var(trim($_POST["email"]), FILTER_SANITIZE_EMAIL); 
    $message = trim($_POST["message"]); 

    // Check that data was sent to the mailer. 
    if (empty($name) OR empty($message) OR !filter_var($email, FILTER_VALIDATE_EMAIL)) { 
     // Set a 400 (bad request) response code and exit. 
     http_response_code(400); 
     echo "Oops! There was a problem with your submission. Please complete the form and try again."; 
     exit; 
    } 

    // Set the recipient email address. 
    // FIXME: Update this to your desired email address. 
    $recipient = "[email protected]"; 

    // Set the email subject. 
    $subject = "A Future Bubbler… $name "; 

    // Build the email content. 
    $email_content = "Name: $name\n"; 
    $email_content .= "Email: $email\n\n"; 
    $email_content .= "Link: $link\n"; 
    $email_content .= "Message:\n$message\n"; 

    // Build the email headers. 
    $email_headers = "From: $name <$email>"; 

    // Send the email. 
    if (mail($recipient, $subject, $email_content, $email_headers)) { 
     // Set a 200 (okay) response code. 
     http_response_code(200); 
     echo "Thank You! Your message has been sent."; 
    } else { 
     // Set a 500 (internal server error) response code. 
     http_response_code(500); 
     echo "Oops! Something went wrong and we couldn't send your message."; 
    } 

} else { 
    // Not a POST request, set a 403 (forbidden) response code. 
    http_response_code(403); 
    echo "There was a problem with your submission, please try again."; 
} 

?>

+0

既然你已經嘗試過編輯的文件,你的企圖代碼添加到您的問題。 – Sean 2015-04-04 15:38:03

+0

增加了肖恩,對此抱歉,應該想到。 – 2015-04-04 17:21:15

+0

看起來像原始代碼。你試圖修改/編輯它的地方在哪裏?由於您想添加/修改輸入,因此您需要對所有3個代碼塊(html,js,php)進行更改。 – Sean 2015-04-04 18:17:48

回答

0

你永遠不會定義$ link。你需要添加$ link = trim($ _ POST ['link']); $ message = trim($ _ POST [「message」]);之前。 - 肖恩4月4日在20:50

- 肖恩,CEO環星