Поэтому у меня есть таблица, извлекающая информацию из базы данных, и мне было интересно, как я могу ее обновить, не перезагружая всю страницу.
Вам понадобится страница getTable.php , отображающая вашу таблицу, и ничего больше: никаких заголовков, нижних колонтитулов и т. Д.
PHP (getTable.php) – это может быть любой код на стороне сервера (asp, html и т. Д.)
<?php echo '<table><tr><td>TEST</td></tr></table>'; ?>
Затем в вашем JS вы можете легко обновить таблицу с помощью метода load() :
HTML
<div id="tableHolder"></div>
JS
<script type="text/javascript"> $(document).ready(function(){ refreshTable(); }); function refreshTable(){ $('#tableHolder').load('getTable.php', function(){ setTimeout(refreshTable, 5000); }); } </script>
Используйте ajax, следующий пример в jQuery:
$(function() { var prevAjaxReturned = true; var xhr = null; setInterval(function() { if( prevAjaxReturned ) { prevAjaxReturned = false; } else if( xhr ) { xhr.abort( ); } xhr = $.ajax({ type: "GET", data: "v1="+v1+"&v2="+v2, url: "location/of/server/script.php", success: function(html) { // html is a string of all output of the server script. $("#element").html(html); prevAjaxReturned = true; } }); }, 5000); });
Функция успеха предполагает, что ваш серверный сценарий выводит html, который вы хотите заменить в элементе с id 'element'.
У вас должна быть страница, которая возвращает информацию и извлекает данные с помощью Ajax / jQuery.
<div class="result"></div> setInterval(function() { $.get('test.php', function(data) { $('.result').html(data); }); }, 5000);
Вот еще один вариант для вас. Это решение использует IIFE, который является предпочтительным по сравнению с setInterval. Вы можете узнать больше о IIFE по ссылке выше.
JAVASCRIPT:
var $results = $('#results'), loadInterval = 5000; (function loader() { $.get('script.php', function(html){ $results.hide(200, function() { $results.empty(); $results.html(html); $results.show(200, function() { setTimeout(loader, loadInterval); }); }); }); })();
HTML:
<div id="results"></div>
setTimeout(function(){ jqueryFunction(Args); },100);
будет работать…
100 = 100 миллисекунд
Следующие работы с JQuery Datatables 1.10
`var tableName; //Set AJAX Refresh interval. $(function() { setReloadInterval(10); //Refresh every 10 seconds. } //Because function takes seconds we * 1000 to convert seconds to milliseconds. function setReloadInterval(reloadTime) { if(reloadTime > 0) internalId = setInterval("reloadTable()", (reloadTime * 1000); } //Auto Refresh JQuery DataTable function reloadTable() { tableName.ajax.reload(); } //Table defined... $(document).ready(function () { tableName = $('#tableName').DataTable({ "sAjaxSource": "/someUrl", });`