MVC_CRUD/Scripts/datatable/examples/server_side/defer_loading.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
	<meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0">
	<title>DataTables example - Deferred loading of data</title>
	<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
	<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
	<link rel="stylesheet" type="text/css" href="../resources/demo.css">
	<style type="text/css" class="init">
	
	</style>
	<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
	</script>
	<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
	</script>
	<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
	</script>
	<script type="text/javascript" language="javascript" src="../resources/demo.js">
	</script>
	<script type="text/javascript" language="javascript" class="init">
	
$(document).ready(function() {
	$('#example').DataTable( {
		"processing": true,
		"serverSide": true,
		"ajax": "scripts/server_processing.php",
		"deferLoading": 57
	} );
} );

	</script>
</head>
<body class="dt-example">
	<div class="container">
		<section>
			<h1>DataTables example <span>Deferred loading of data</span></h1>
			<div class="info">
				<p>When using DataTables with server-side processing, the default behaviour is to have DataTables automatically make an Ajax call and load the data, removing
				anything which might have already been in the table. However, this behaviour might not always be desirable when the first page of the table has already been
				preloaded in the HTML (which you might do to ensure accessibility or for performance reasons).</p>
				<p>This automatic Ajax call to get the first page of data can be overridden by using the <a href="//datatables.net/reference/option/deferLoading"><code class=
				"option" title="DataTables initialisation option">deferLoading</code></a> initialisation property. It serves two purposes, firstly to indicate that deferred
				loading is required, but also to tell DataTables how many records there are in the full table, in this case 57 (this allows the information element and pagination
				to be displayed correctly).</p>
				<p>In the example below, the HTML page already has the first 10 rows of data available it in, so we use <a href=
				"//datatables.net/reference/option/deferLoading"><code class="option" title="DataTables initialisation option">deferLoading</code></a> to tell DataTables that this
				data is available and that it should wait for under interaction (ordering, paging etc) before making an Ajax call.</p>
			</div>
			<div class="demo-html"></div>
			<table id="example" class="display" cellspacing="0" width="100%">
				<thead>
					<tr>
						<th>First name</th>
						<th>Last name</th>
						<th>Position</th>
						<th>Office</th>
						<th>Start date</th>
						<th>Salary</th>