遠端網域的 JSONP 資料來源
JSONP 是一種允許多個伺服器使用 JSON 資料的方法（瀏覽器具有 XSS 保護規則，基於安全考量，會封鎖對遠端來源的標準 Ajax 請求）。使用 JSONP 允許 DataTables 從任何網域載入伺服器端來源的資料，並且只需使用 ajax 初始化選項的 dataType 選項即可輕鬆完成。
當以物件形式給定時，ajax 選項會直接對應到 jQuery ajax 選項（也就是說，任何可在 jQuery 的 Ajax 函式中使用的選項，也可在 DataTable 的 ajax 選項中使用）。
下面的範例顯示如何使用 ajax 並將 dataType 選項設定為檢索 JSONP 資料，以在 DataTables 中進行伺服器端處理。
| 名字 | 姓氏 | 職位 | 辦公室 | 開始日期 | 薪資 |
|---|---|---|---|---|---|
| 名字 | 姓氏 | 職位 | 辦公室 | 開始日期 | 薪資 |
- Javascript
- HTML
- CSS
- Ajax
- 伺服器端腳本
- 註解
下面顯示的 Javascript 用於初始化此範例中顯示的表格
$('#example').DataTable({ ajax: { url: 'scripts/jsonp.php', dataType: 'jsonp' }, processing: true, serverSide: true });
new DataTable('#example', { ajax: { url: 'scripts/jsonp.php', dataType: 'jsonp' }, processing: true, serverSide: true });
除了上面的程式碼之外，還載入了以下 Javascript 函式庫檔案以在此範例中使用
下面顯示的 HTML 是原始 HTML 表格元素，尚未經過 DataTables 的增強
此範例除了從函式庫檔案載入的 CSS 之外，還使用了一些額外的 CSS (如下)，以便正確顯示表格。使用的其他 CSS 如下所示
載入了以下 CSS 函式庫檔案以在此範例中使用，以提供表格的樣式設定
此表格透過 Ajax 載入資料。下面顯示的是已載入的最新資料。當載入任何其他資料時，此資料將自動更新。
下面顯示的是用於執行此表格的伺服器端處理的腳本。請注意，這只是一個使用 PHP 的範例腳本。可以使用任何語言編寫伺服器端處理腳本，並使用DataTables 文件中描述的協定。