Php 如何使用ajax更新此页面？_Php_Ajax_Mysqli

Php 如何使用ajax更新此页面？

php ajax

Php 如何使用ajax更新此页面？,php,ajax,mysqli,Php,Ajax,Mysqli,嗨，所以我设法找出了我最大的问题，我很高兴它能按照我想要的方式工作。现在，实现我的目标的第二个阶段是能够使用ajax更新页面而无需刷新。下面是php etc，有人能给我指点方向吗。谢谢 <?php $link = mysqli_connect('localhost','root','password','database'); if (mysqli_connect_errno()) { echo 'Error: Could not connect to database. Plea

嗨，所以我设法找出了我最大的问题，我很高兴它能按照我想要的方式工作。现在，实现我的目标的第二个阶段是能够使用ajax更新页面而无需刷新。下面是php etc，有人能给我指点方向吗。谢谢

<?php
$link = mysqli_connect('localhost','root','password','database');
if (mysqli_connect_errno()) {
    echo 'Error: Could not connect to database. Please try again later';
    exit;   
}
$db = mysqli_select_db($link, "database");

//check if the starting row variable was passed in the URL or not
if (!isset($_GET['feedback']) or !is_numeric($_GET['feedback'])) {
  //we give the value of the starting row to 0 because nothing was found in URL
  $feedback = 0;
//otherwise we take the value from the URL
} else {
  $feedback = (int)$_GET['feedback'];
}
$prev = $feedback - 4;

$query = "SELECT * FROM clients, orders WHERE clients.ID = orders.ID ORDER BY Date DESC LIMIT $feedback,4";

$result = mysqli_query($link,$query);


?>
<div class="sidebar">
           <div class="clientwrapper">
                <h2>Client Feedback</h2>
                    <div class="box">                   
                    <?php 
                     while($row=mysqli_fetch_array($result)){
                     echo '<p> '.$row["Comments"].' <span class="name"> By '.$row["Organisation"].' </span></p>'; 
                     }
                     ?>
                    <?php echo  '<a class="nodecoration" href=" '.$_SERVER['PHP_SELF'].'?feedback='.($feedback+4).'" ><span class="next-button">More</span></a>' ?>
                    <?php if ($prev >= 0) echo  '<a class="nodecoration" href=" '.$_SERVER['PHP_SELF'].'?feedback='.$prev.'" ><span class="prev-button"></span></a>' ?>

                   <div class="clear"></div>
                     </div>
            </div>



         <div class="announcewrapper">
        <h2>Announcements</h2>
        <div class="box">
        <p>There are currently no announcements.</p>
        </div>       
        </div>

    </div>

看看这段代码，它表明您正在开发一个更大的应用程序。首先，仔细阅读。从长远来看，学习这一点而不是使用旧的脚本编写方法将对您大有帮助。现在花时间做这件事的好处远远超过了它不能像你想的那样快速工作的缺点

话虽如此，无论您是否决定将其分类，我都会删除脚本顶部的逻辑并将其粘贴到另一个文件中，该文件可从web服务器访问。转储JSON格式的内容，而不是回显表格式的数据

将此页面中的顶部代码替换为curl，将新创建的文件粘贴到服务器上，并对其进行json_解码，以获得可用于构造表的可迭代对象。如果你正在处理一个帖子回复，那么做一个帖子或者更好的删除卷曲

现在是棘手的部分。您希望您的脚本能够增强服务器驱动的功能，而不是过于显眼。最简单的方法是使用类似jQuery的框架，绑定到click events，并使用event.preventDefault功能防止服务器发回。在脚本化事件绑定到的函数中，在那里进行$.ajax调用，在延续中显示您想要的任何数据

希望有帮助。如果你对其中任何一个术语都不熟悉，快速的谷歌搜索将产生关于每个主题的大量文档

试试下面的AJAX代码

function change_category(id)
{

        $.ajax({
            type: "POST",
            url: "ajax_update_query.php?subcat="+sub_cat,
            data:   "pid=" + id,
            success: function(html){
                $("#response_sub_cat").html(html);
            }
        });
}

你可以把这个函数放在你正在使用的任何事件上，我的意思是onClick，onChange等等。。在ajax_update_query.php页面中，您可以根据自己的需求查询更新数据库

谢谢。

这有点遥不可及，因为我没有处理您的代码，我通常通过调整代码并逐步测试来开发。因此，这可能需要在你这方面做更多的工作，以使其正常运行

// BUGGY INITIAL CODE REMOVED

附属物

此解决方案使用的是s-See。您需要在页面的上述代码所在的部分包含jQuery，使用以下命令：

<head>
<!-- Whatever other bits are already here //-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"
        type="text/javascript"></script>
</head>

您好，首先不是php查询，而是MySQL查询。：谢谢您的回复，但很抱歉，我是一个彻头彻尾的笨蛋，不懂稍后将介绍的json和curl内容。这不是一个大项目，wesite只有大约12页，通过不同页面上的includes重复评论框。我计划将最上面的代码作为配置和查询文件放在另一个文件中，并将其包括在内。哇，非常感谢，但我有一些问题。据我所知，该脚本没有使用XMLHTTPRequest动态更新div。此外，当点击更多的时候，页面实际上会刷新，因为它会再次跳到顶部，或者我弄错了。最后，我对代码的javascript部分有点困惑，因为它可能是以一个非常有经验的人会采用的方式完成的，而我只是一个初学者。当然，您需要在See my Answer中包含jQuery，并对其进行更详细的修改、引用和示例，以便更好地了解它的工作原理。在这里的XAMPP上测试正常。天哪，非常感谢，我现在可以在我的其他页面上修改它，需要类似的东西运行。感谢，我没有真正回答OP的问题。我没有给出完整的输出解决方案。这只是给我的提示。有洞察力的眼睛只需要一个提示，而轻描淡写让想象力可以自由地构建自己的细节。谢谢

<html>
<head>
<title>Tester</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
<style>
a.inactive { color:#AAA; }
</style>
</head>
<body>
<?php
# Page Configuration Details
$dbHost = 'localhost';
$dbUser = 'root' ;
$dbPass = 'password';
$dbBase = 'database';
$reviewsPerPage = 4;

#$link = mysqli_connect( $dbHost , $dbUser , $dbPass , $dbBase );         // PROD DATA ONLY
#if( mysqli_connect_errno() )                                             // PROD DATA ONLY
#  die( 'Error: Could not connect to database. Please try again later' ); // PROD DATA ONLY

#$db = mysqli_select_db( $link , $dbBase );                               // PROD DATA ONLY

//check if the starting row variable was passed in the URL or not
if( !isset( $_GET['feedback'] ) || !is_numeric( $_GET['feedback'] ) ){
  //we give the value of the starting row to 0 because nothing was found in URL
  $feedback = 0;
  $prevPage = false;
}else{
  //otherwise we take the value from the URL
  $feedback = (int) $_GET['feedback'];
  $prevPage = max( $feedback-$reviewsPerPage , 0 );
}
$nextPage = $reviewsPerPage+$feedback;

#$query = "SELECT * FROM clients, orders                                  // PROD DATA ONLY
#           WHERE clients.ID = orders.ID                                  // PROD DATA ONLY
#           ORDER BY Date DESC                                            // PROD DATA ONLY
#           LIMIT $feedback,$reviewsPerPage";                             // PROD DATA ONLY

#$result = mysqli_query( $link , $query );                                // PROD DATA ONLY

$result = array_fill(                                                     // TEST DATA ONLY
            $feedback ,                                                   // TEST DATA ONLY
            $reviewsPerPage ,                                             // TEST DATA ONLY
            array(                                                        // TEST DATA ONLY
              'Comments'=>'The comments' ,                                // TEST DATA ONLY
              'Organisation'=>'John Smith'                                // TEST DATA ONLY
            )                                                             // TEST DATA ONLY
          );                                                              // TEST DATA ONLY

?>
<div class="sidebar">
  <div class="clientwrapper">
    <h2>Client Feedback</h2>
    <div id="clientFeedback" class="box">
      <div class="feedbackHolder">
        <div id="clientFeedbackContent">
<?php 
#while( $row = mysqli_fetch_array( $result ) ){                           // PROD DATA ONLY
foreach( $result as $k => $row ){                                         // TEST DATA ONLY
  #echo '          <p>'.$row['Comments'].                                 // PROD DATA ONLY
  #     ' <span class="name">By '.$row['Organisation'].'</span></p>';     // PROD DATA ONLY
  echo '          <p>#'.$k.': '.$row['Comments'].                         // TEST DATA ONLY
        ' <span class="name">By '.$row['Organisation'].'</span></p>';     // TEST DATA ONLY
}

echo '          <a class="nodecoration" href="'.$_SERVER['PHP_SELF'].'?feedback='.$nextPage.'" ><span class="next-button">More</span></a>'."\n";
echo '          <a class="nodecoration'.( $prevPage===false ? ' inactive' : '' ).'" href="'.$_SERVER['PHP_SELF'].'?feedback='.(int) $prevPage.'" ><span class="prev-button">Prev</span></a>'."\n";
?>
        </div>
      </div>
      <div class="clear"></div>
      <script type="text/javascript">
      var reviewsPerPage = <?php echo $reviewsPerPage; ?>;
      $(document).ready(function(){
        // Bind our Custom Code to the "A" tags with class "nodecoration" within the "clientFeedback" div
        $( '#clientFeedback a.nodecoration' ).live( 'click' , function(e){
          console.log( 'Running' );
          e.preventDefault();
          // Get the URL to Load
          theURL = $( this ).attr( 'href' );
          // Use the jQuery $.load() function to replace the contents of this element
          // with another element gained through AJAX
          $( '#clientFeedback .feedbackHolder' )
            .load(
              theURL+' #clientFeedbackContent' ,
              function(){
                e.preventDefault(); // Prevent the link from behaving like it normally would.
              });
        });
      });
      </script>
    </div>
  </div>
  <div class="announcewrapper">
    <h2>Announcements</h2>
    <div class="box">
      <p>There are currently no announcements.</p>
    </div>       
  </div>
</div>
</body>
</html>