页面刷新时加载数据-dataTable

Load data on page refresh - dataTable

本文关键字：数据 -dataTable 加载 刷新      更新时间：2023-09-26

我的数据表代码都按预期工作，因为它根据时间间隔用数据刷新表。我唯一想修复的是，当有人刷新整个页面时，在触发时间间隔设置之前，还没有加载任何数据。有没有一种方法，只有当有人刷新整个页面时，我才能立即加载数据，然后设置的间隔开始生效。感谢

<head>
<script type="text/javascript" charset="utf-8">
<!-- ------------------- Function to display maintenance messages ---------------------- -->
    $(document).ready(function() {
        var maintenanceTable = $('#maint-table').DataTable({
            "jQueryUI": true,
            "columns": [
                { "data": "msg" }
            ],
            "language": {
                "emptyTable": "No Maintenances Available in Table"
            }
        });
        setInterval (function(){
            $.getJSON("include/maintenance.php", function (pcheckmaint){
                maintenanceTable.clear().draw();
                maintenanceTable.rows.add(pcheckmaint.maint).draw();
                maintenanceTable.columns.adjust().draw();
            });
        }, 120000);
    });
</script>

<script type="text/javascript" charset="utf-8">
<!-- ------------------- Extract all Alerts ---------------------- -->
    $(document).ready(function (){
        var alertTable = $('#alert-table').DataTable({
            "jQueryUI": true,
            "columns": [
                { "data": "source", "visible": false },
                { "data": "host" },
                { "data": "description" },
                { "data": "priority" },
                { "data": "acknowledged"}
            ],
        });
        setInterval (function(){
            $.getJSON("data/json_data.txt", function (pcheckdata){
                alertTable.clear().draw();
                alertTable.rows.add(pcheckdata.alert).draw();
                alertTable.columns.adjust().draw();
            });
        }, 10000);
    });
        function ackbutton() {
            //e.preventDefault();
            var $this = $(this);
            var getvalues = $('#evtid').val();
            alert(getvalues);
        }
</script>
</head>

将函数从setInterval调用中取出，并将其声明为命名函数。然后调用该函数，然后再次调用该函数的setInterval。这样，它会立即调用一次，然后重复

getData();
getMaintenance();
setInterval(getData, 10000);
setInterval(getMaintenance, 120000);
function getData()
{
    $.getJSON("data/json_data.txt", function (pcheckdata)
    {
        alertTable.clear().draw();
        alertTable.rows.add(pcheckdata.alert).draw();
        alertTable.columns.adjust().draw();
    });
}
function getMaintenance()
{
    $.getJSON("include/maintenance.php", function (pcheckmaint)
    {
        maintenanceTable.clear().draw();
        maintenanceTable.rows.add(pcheckmaint.maint).draw();
        maintenanceTable.columns.adjust().draw();
    });
}
相关文章：