嘗試使用AJAX

我嘗試以下幾個關於使用AJAX添加到MySQL數據庫在網絡上的實例添加到數據庫，但它不張貼到數據庫，但在頁面的底部正在執行的標題。嘗試使用AJAX

這是HTML文檔，您輸入的信息

編輯：謝謝所有的答案，這已得到修復。

<!DOCTYPE HTML> 
    <html> 
    <head> 
     <script type="text/javascript" src="message.js"></script> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
     <link rel="stylesheet" type="text/css" href="style.css"> 
    <title>Add a comment!</title> 
    </head> 
    <body id="bodymain"> 
     <a href="home.php">Home</a> 
     <br> 

     <div id="main"> 
      <?=$blog_post_history?> 
      </div> 
      <br> 
      <br> 

      <form method="post" action="addreply.php"> 
      <input type="hidden" name="blogid" value="<?php echo $_GET['id'] ?>"> 
      Author:  <input type="text" name="poster" size="60"> 
      <br> 
      Email:  <input type="text" name="email" size"60"> 
      <br> 
      Comment: <textarea name='content' rows=10 cols=50 id='content'></textarea> 

       <input type="submit" value="send" /> 
    </form> 
    </body> 
    </html>

這是JavaScript

$(function(){ 
    //Whenever the form submites, call this 
    $("form").submit(function()) { 
     //submit using ajax 
     submitMessage(); 
     //prevent from submitting 
     return false; 
    } 
}; 


var submitMessage = function(){ 
    if($("#content").val().length > 0 && $("author").val.length > 0) 
    { 
     //start ajax request 
     $.post(
      "addreply.php" 
      { 
       content: $("#message").val(), 
       author: $("#author").val(), 
       email: $("email").val(), 
       blogid: $("blogid").val() 
      }, 


     ); 
    } 
};

這是PHP頁面添加到數據庫

<?php 

include("connect.php"); 

    $add_comment_query = $db->prepare(" 
     INSERT INTO `comments` 
      (`email`, `author`, `content`, `postid`) 
     VALUES 
      (:email, :author, :content, :postid) 
    "); 

    $add_message_query->execute(array(
     ':email' => $_POST['email'], 
     ':author'=> $_POST['author'], 
     ':content' => $_POST['content'], 
     ':postid' => $_POST['blogid'] 
    )); 

    // This calls for a '301' response code instead of '200', with a 'Location' 
    // sent to tell the browser where to redirect to. 
    header("Location: home.php"); 

?>

任何人都可以看到，我錯了。我完全難倒了。

來源

2013-05-06 Chris

是否拋出一個錯誤？ – 2013-05-06 18:43:18

$("author")和$("#author")應該$("#poster")。

而且，所有的<input>元素midding id屬性。所以：

<input type="text" name="poster" size="60">

應該是：

<input type="text" name="poster" id="poster" size="60">

，同樣爲所有其他輸入。

來源

2013-05-06 18:44:03 Barmar

也意識到我命名我的pdo對象兩個不同的東西。會嘗試這個真正的快速和更新 – Chris 2013-05-06 18:47:50

非常感謝您的幫助Barmar，如果我能給予好評你，我會，但我需要8個點！ – Chris 2013-05-06 18:49:37

只要接受答案，這比upvoting更好。 – Barmar 2013-05-06 18:50:00

你的選擇是不正確的。

你嘗試調試瀏覽器的JavaScript，看看有什麼的，例如$("#author")價值？

哈希是ID選擇，所以你需要的HTML該元素有一個id屬性：

<input type="text" name="poster" id="poster" size="60">

所有其他領域應進行類似修改，以便您要使用的每個元素都有一個ID和每個jquery選擇器格式爲「＃」當前作者，電子郵件和blogid有錯誤的選擇器。

製作的HTML：

<!DOCTYPE HTML> 
<html> 
<head> 
    <script type="text/javascript" src="message.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
<title>Add a comment!</title> 
</head> 
<body id="bodymain"> 
    <a href="home.php">Home</a> 
    <br> 

    <div id="main"> 
     <?=$blog_post_history?> 
     </div> 
     <br> 
     <br> 

     <form method="post" action="addreply.php"> 
     <input type="hidden" id="blogid" name="blogid" value="<?php echo $_GET['id'] ?>"> 
     Author:  <input type="text" name="poster" id="poster" size="60"> 
     <br> 
     Email:  <input type="text" name="email" id="email" size"60"> 
     <br> 
     Comment: <textarea name='content' rows=10 cols=50 id='content'></textarea> 

      <input type="submit" value="send" /> 
</form> 
</body> 
</html>

和你的jQuery：

var submitMessage = function(){ 
    if($("#content").val().length > 0 && $("#poster").val.length > 0) 
    { 
     //start ajax request 
     $.post(
      "addreply.php" 
      { 
       content: $("#message").val(), 
       author: $("#poster").val(), 
       email: $("#email").val(), 
       blogid: $("#blogid").val() 
      }, 


     ); 
    } 
};

來源

2013-05-06 18:44:35 tster

嘗試使用AJAX

回答

相關問題