Question

我有一个动态表，显示来自mysql数据库的数据。我的数据库每次都在服务器中更新。我想每2秒刷新一次表而不刷新整个页面。怎么办呢？请帮忙怎么做到这一点？我桌子的一部分看起来像这样：

＆＃13;

<table id="getdata" border="0" align="left" cellpadding="0" cellspacing="0">
  <tr>
    <td bgcolor="#CCFF00">Name</td>
    <td bgcolor="#CCFF00">Comment</td>
    <td bgcolor="#CCFF00">DatePosted</td>
  </tr>
</table>

＆＃13;

Answer 1

您需要使用客户端脚本语言（如javascript）才能刷新HTML页面上的某些内容。一个非常常见的库是jQuery。

PHP

# ajax.php
$contents = '<table class="table table-hover">
    <thead>
        <tr>
            <th>Sound</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Bzzz Bzz</td>
        </tr>
    </tbody>
</table>';

echo json_encode($content);

HTML / JavaScript的

<button class="refresher">Refresh table</button>
<table id="table-to-refresh">
    <thead>
        <tr>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td></td>
        </tr>
    </tbody>
</table>

<script type="text/javascript">
$(document).ready(function () {
    $(document).on('click', '.refresher', function () {
        $.ajax({
            url: 'ajax.php',
            method: get,
            dataType: 'json',
            success: function(response) {
                $('#table-to-refresh').html(response);
            }
        });
    });
});
</script>

补充阅读

jQuery Docs - Ajax

Answer 2

在指定的时间间隔内使用ajax，如：

$.ajax({
    url: 'your_url',
    method: get,
    data:
    {
        var1 : val1
    },
    success: function(response)
    {
        $('#getdata').html(response);       // it will update the html of table body
    }
});

Answer 3

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
$('#load_tweets').load('file.php').fadeIn("slow");
}, 10000); // refresh every 10000 milliseconds



</script>

在文件中放置完整的html和php sql代码，例如f ull代码，用于生成该表。

检查这是否为参考http://www.9lessons.info/2009/07/auto-load-refresh-every-10-seconds-with.html

Answer 4

只需这样做：

     $.ajax({
                contentType: contentType,
                dataType: dataType,
                type: type,
                url: urlGetsearch,
                data: '{textvalue: "' + $("#tableId").val() + '" }',

        success: function (textvalue) {

            $("#tableId").html(htmlData);
        },

    });
}

控制器看起来像这样：-

         [HttpPost]
         public ActionResult Getsearch(string textvalue)
          {
                      your code.....
          }

如何在不刷新整个html页面的情况下刷新动态表

4 个答案:

PHP

HTML / JavaScript的

补充阅读