Question

我是php和ajax的新手，我一直在尝试创建一个实时仪表板，从mysql数据库更新而不刷新页面。我已经能够在下面的代码中创建它，但是我正在努力如何调整它，以便它可以使用多个SQL查询和不同的Div。

目前我的代码运行sql查询并输出到OrderSubmitted Div ID。我想要输出另一个SQL查询到div Id订单满足我将如何去做这个？

HTML

          <div class="row">
        <!-- Left Box -->
        <div class="col-lg-6 col-sm-6" style="padding-right:15px; padding-left:0px">
          <div class="well" style="height: 300px;">
            <h2 style="text-align:center; font-size:8em;">
              <div id="SubmittedOrders"></div>
            </h2>
            <p style="text-align:center; font-size:1.5em;">Outstanding Orders</p>
          </div>
        </div>
        <!-- Right Box -->

        <div class="col-lg-6 col-sm-6" style="padding-left:15px; padding-right:0px">
          <div class="well" style="height: 300px;">
            <h2 style="text-align:center; font-size:8em;"> 
              <div id ="OrderFulfilled"></div>
            </h2>
            <p style="text-align:center; font-size:1.5em;">Orders fulfiled today</p>
          </div>
        </div>

      </div>

AJAX脚本

function getOrderStatus() {

  ?>

    <script>
      // IE5/6 support

      function ajax_loop() {

        if (window.XMLHttpRequest) {
          xmlhttp=new XMLHttpRequest();
        } else {
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }

        // Create function for handling AJAX response
        // Set dashboard div's contents to the response for Submitted Orders 
        xmlhttp.onreadystatechange=function() {
          if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            document.getElementById("SubmittedOrders").innerHTML = xmlhttp.responseText;
            setTimeout(ajax_loop, 1000);
          }
        }

        // Send AJAX request
        xmlhttp.open("POST","getOrderStatus.php");
        xmlhttp.setRequestHeader( "Content-type", "application/x-www-form-urlencoded" );
        xmlhttp.send("action=update");

      }

      ajax_loop();

    </script>  

  <?php

}

getOrderStatus Php文件

 <?php
  // Query users table
  $sql = "SELECT COUNT(STATUS) from CE_TRANSACTIONS where STATUS = 0;";

// Execute query 
  $result = mysqli_query( $link, $sql );

// Loop through rows and draw table

  while ( $row = mysqli_fetch_assoc($result) ) {

     foreach ( $row as $field ) {
        echo "$field";
     }
  }

Answer 1

您正在混合前端和后端的职责。

你的FrontEnd应该是一个静态HTML，有些需要JS代码。然后在你的触发器（可能是document.ready或某个按钮点击）之后，JS函数应该对返回JSON的PHP文件进行AJAX调用。

对于您要更新的每个DIV，您可以使用AJAX从您的页面调用此PHP文件。

有很好的教程可以通过JQuery网站上的AJAX动态更改HTML页面内容。

例如：http://learn.jquery.com/ajax/jquery-ajax-methods/

某些Google点击次数：https://www.youtube.com/watch?v=Ga3pOn7wXBA

从mysql数据库刷新多个Div

1 个答案: