ajax调用未更新

时间:2016-10-26 22:33:37

标签: ajax call

我做了一个Ajax调用。 它显示我网站上的数据,但如果我在数据库中更改它,它不会自动更新(不按f5(刷新我的网站))。

这是我的代码:

$(document).ready(function(){
    getname();
})
function getname(){
        $.ajax({
            type: 'post',
            url: '../php/clas/name.php',
            data: 'type=getthename',
            dataType: 'json',
            success: function(responseOrderData){
                var showOrderData = '';
                var rows = 0;
                $.each(responseOrderData, function(index){
                    rows++;
                    showOrderData += '<tr>';
                    showOrderData += '<td>';
                    showOrderData += responseOrderData[index].name;
                    showOrderData += '</td>';
                    showOrderData += '</tr>';
                    console.log(responseOrderData);
                });
                if(rows == 0){
                    showOrderData += '<tr><td colspan="7"><center><i class="fa fa-refresh fa-spin"></i></center></td></tr>';    
                }
                $('.orderData').html(showOrderData);
            },
            timeout: 1000,
            error: function(error){
                console.log(error);
            }
        })
    }

1 个答案:

答案 0 :(得分:0)

您需要像socket.io这样的东西进行实时更新并将数据从服务器发送到客户端,但您可以使用JavaScript setTimeoutsetInterval来刷新html内容而无需重新加载页面

$(document).ready(function(){
    getname();
})
function getname(){
        $.ajax({
            type: 'post',
            url: '../php/clas/name.php',
            data: 'type=getthename',
            dataType: 'json',
            success: function(responseOrderData){
                var showOrderData = '';
                var rows = 0;
                    if(rows == 0){
                    showOrderData += '<tr><td colspan="7"><center><i class="fa fa-refresh fa-spin"></i></center></td></tr>';    
                }
                $.each(responseOrderData, function(index){
                    rows++;
                    showOrderData += '<tr>';
                    showOrderData += '<td>';
                    showOrderData += responseOrderData[index].name;
                    showOrderData += '</td>';
                    showOrderData += '</tr>';
                    console.log(responseOrderData);
                });

                $('.orderData').html(showOrderData);
                //wait 10 seconds after ajax called successfully
                setTimeout(getname,10000);
            },
            timeout: 1000,
            error: function(error){
                console.log(error);
            }
        })
    }