2012-04-25 78 views
1

我有一個頁面,我試圖給它添加一個ajax評論系統。當我將/ comment目錄中的所有代碼放入根目錄時,我的新頁面可以實現該腳本。但是,如果我創建另一個目錄,請說/ books,然後鏈接到/ comment目錄中的頁面,它不會發布評論。我可以顯示它們並訪問javascript頁面,但我不能提出新的評論。是什麼導致它失敗。我認爲它是在JavaScript文件中的某個地方......如果您需要查看其他內容,我不想包含太多的代碼,請告訴我,我會發布它。我將把php文件和javascript文件包含在一個目錄中,然後放到另一個目錄中......任何提示都會很棒。這裏是我的網頁:如何讓ajax評論系統從不同的目錄工作?

<?php 

// Error reporting: 
error_reporting(E_ALL^E_NOTICE); 


include('../comments/connect.php'); 
include($_SERVER['DOCUMENT_ROOT'] . '/comments/comment.class.php'); 



/* 
/ Select all the comments and populate the $comments array with objects 
*/ 

$comments = array(); 
$result = mysql_query("SELECT * FROM comments ORDER BY id ASC"); 

while($row = mysql_fetch_assoc($result)) 
{ 
    $comments[] = new Comment($row); 
} 

?> 

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="../style.css" /> 
</head> 
<body> 

<ul id="nav"> 
    <li class="current"><a href="index.html">Home</a></li> 
    <li><a href="#"></a> 
     <ul> 
      <li><a href="#"></a></li> 
</ul> 
<div id="container"> 

    <div id="content"> 

<?php 

/* 
/ Output the comments one by one: 
*/ 

foreach($comments as $c){ 
    echo $c->markup(); 
} 

?> 

<div id="addCommentContainer"> 
    <p>Add a Comment</p> 
    <form id="addCommentForm" method="post" action=""> 
     <div> 
      <label for="name">Your Name</label> 
      <input type="text" name="name" id="name" /> 

      <label for="email">Your Email</label> 
      <input type="text" name="email" id="email" /> 

      <label for="url">Website (not required)</label> 
      <input type="text" name="url" id="url" /> 

      <label for="body">Comment Body</label> 
      <textarea name="body" id="body" cols="20" rows="5"></textarea> 

      <input type="submit" id="submit" value="Submit" /> 
     </div> 
    </form> 
</div> 
</p> 

    </div> 
</div> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript" src="../comments/script.js"></script> 
</body> 
</html> 

和JavaScript ...

$(document).ready(function(){ 
    /* The following code is executed once the DOM is loaded */ 

    /* This flag will prevent multiple comment submits: */ 
    var working = false; 

    /* Listening for the submit event of the form: */ 
    $('#addCommentForm').submit(function(e){ 

     e.preventDefault(); 
     if(working) return false; 

     working = true; 
     $('#submit').val('Working..'); 
     $('span.error').remove(); 

     /* Sending the form fileds to submit.php: */ 
     $.post('submit.php',$(this).serialize(),function(msg){ 

      working = false; 
      $('#submit').val('Submit'); 

      if(msg.status){ 

       /* 
       / If the insert was successful, add the comment 
       / below the last one on the page with a slideDown effect 
       /*/ 

       $(msg.html).hide().insertBefore('#addCommentContainer').slideDown(); 
       $('#body').val(''); 
      } 
      else { 

       /* 
       / If there were errors, loop through the 
       / msg.errors object and display them on the page 
       /*/ 

       $.each(msg.errors,function(k,v){ 
        $('label[for='+k+']').append('<span class="error">'+v+'</span>'); 
       }); 
      } 
     },'json'); 

    }); 

}); 

回答

2

我認爲問題是在JavaScript端,你的文章去一個相對URL,你應該有一個絕對的URL替換:

/* Sending the form fileds to submit.php: */ 
$.post('submit.php',$(this).serialize(),function(msg){//<- replace submit.php with absolute url 
... 
+0

提交路徑是問題。非常感謝你! – Paxwell 2012-04-25 14:43:14

+0

我改變了提交路徑,看看其他人解決方案是否實際解決了問題。它是。所以,他拿蛋糕。 – Paxwell 2012-04-25 14:47:31

+0

哈哈im很抱歉,但我忘了保存它。你是真正的解決方案。我很抱歉。 – Paxwell 2012-04-25 14:49:10

3

似乎你連接到數據庫與包括使用相對路徑:

include('../comments/connect.php'); 

那將是第一個改變,它可能是這樣的:

include($_SERVER['DOCUMENT_ROOT'] . '/comments/connect.php'); 

通常,查找相對路徑並查看是否可以將它們更改爲絕對路徑,或者相對於php文件的服務器根目錄,或者相對於JavaScript文件的Web根目錄。

+0

似乎並不是這裏的問題 – malko 2012-04-25 14:14:09

+0

我正在建立所有連接,但由於某種原因,我無法將表單數據傳遞給submit.php並傳遞到數據庫中。我不認爲這會解決我的問題。 – Paxwell 2012-04-25 14:14:49

+0

@Paxwell看我的編輯。 – jeroen 2012-04-25 14:15:39

3

您通常有您的評論的腳本在不網址更改,即www.domain.com/comments。然後,您可以使用GET請求獲取頁面的註釋(通過查詢字符串參數指定頁面,URL或其他唯一標識符),然後可以使用POST請求發佈評論。

這樣,您的評論模塊與您的應用程序完全分離,如果您需要說明,更改您的數據庫詳細信息或文件路徑,則無需查看其中包含的每個腳本。

在它的最簡單的,你可以有一個PHP文件看起來像這樣您的意見腳本:

<?php 

header('Content-Type: application/json'); 

switch (strtolower($_SERVER['REQUEST_METHOD'])) { 
    case 'get': 
     // return comments for page in JSON format 
    break; 
    case 'post': 
     // post new comment; return result in JSON format 
    break; 
} 

然後在你的HTML視圖文件:

<!DOCTYPE html> 
<html> 
    <body> 
    <div id="comments"></div> 
    <form action="http://domain.com/comments.php" method="post" id="new-comment"> 
     <!--rest of your form here--> 
    </form> 
    <script src="jquery.js"></script> 
    <script> 
     $(document).ready(function() { 
     $.getJSON('http://domain.com/comments.php?page_id=YOUR_PAGE_ID', function(comments) { 
      $.each(comments, function(index, comment) { 
      // add comment to #comments div 
      }); 
     }); 

     $('#new-comment').submit(function() { 
      $.post('http://domain.com/comments.php', $(this).serialize(), function(response) { 
      // act on your form depending is response was success or not 
      }); 
      return false; 
     }); 
     }); 
    </script> 
    </body> 
</html> 

你也可以換了在插件中使用上面的代碼,然後用一行代碼將您的註釋小部件添加到您的頁面,即$('#comments').nameOfYourCommentsPlugin();

希望這對您構建工作解決方案足夠有幫助。

+0

這是有幫助的,但不是我正在尋找。謝謝。 +1 – Paxwell 2012-04-25 14:43:47

+0

@Paxwell我知道。發佈後我意識到我有點切線。抱歉! – 2012-04-25 15:26:06

+0

您的解決方案非常優雅:D,我喜歡它* voteup *,但可能會混淆新手。 – Tei 2012-04-25 15:52:32