预定义状态 - 不保存、删除、重命名或创建
此範例展示了如何使用 StateRestore 擴充功能提供預定義的狀態。已儲存狀態按鈕下的狀態包含預定義的狀態，其將捲動表格並套用排序到第三列。
使用 stateRestoreConfig 配置對象的 rename、save 和 remove 選項可以禁用重新命名，更新和刪除此狀態的意思就是沒有理由將狀態作為拆分按鈕。它只是一個常規按鈕，僅提供加載功能。由於它內建於最初發送的 ajax 資料中，因此該狀態將始終顯示在新頁面載入時。
| ID | 名 | 姓 | 郵遞區號 | 國家 |
|---|
- Javascript
- HTML
- CSS
- Ajax
- 伺服器端腳本
- 註解
下方的 Javascript 用來初始化此範例中顯示的表格
$('#example').DataTable({ ajax: { url: '../data/2500States.txt', dataSrc: 'data' }, layout: { topStart: { buttons: [ { extend: 'savedStates', config: { save: false, rename: false, remove: false } } ] } }, scrollY: 200, scrollCollapse: true, scroller: true });
new DataTable('#example', { ajax: { url: '../data/2500States.txt', dataSrc: 'data' }, layout: { topStart: { buttons: [ { extend: 'savedStates', config: { save: false, rename: false, remove: false } } ] } }, scrollY: 200, scrollCollapse: true, scroller: true });
除了以上的程式碼外，此範例已載入以下的 Javascript 函式庫檔案供使用
下方 HTML 是未經 DataTables 增強前的原始 HTML 表格元素
為了正確顯示表格，此範例使用了部分額外的 CSS，這些 CSS 是在載入函式庫檔案 (在下方) 之後才使用的。下方顯示所使用的額外 CSS
為了供表格造型使用，載入了以下的 CSS 函式庫檔案供此範例使用
這個表格會透過 Ajax 載入資料。已載入的最新資料顯示如下方。隨著任何其他資料的載入，這些資料將自動更新。
下方顯示用於執行此表格的伺服器端處理的腳本。請注意，這只是使用 PHP 的範例腳本。伺服器端處理腳本可以使用任何語言寫作，並使用 DataTables 文件中所述的協定。