DataTables示例 远程域的JSONP数据源

JSONP 是其中之一 允许使用来自任何服务器的JSON数据的几种方法(浏览器具有XSS保护规则, 出于安全原因,将阻止标准Ajax对远程源的请求)。使用JSONP允许DataTables 从任何域加载服务器端源数据,只需使用 dataType 的选项 ajaxDT 初始化 option.

当作为对象给出时, ajaxDT 选项直接映射到 jQuery 阿贾克斯 选项(即可以使用的任何选项 在jQuery的Ajax函数中也可以在DataTable的 ajaxDT 选项)。

以下示例显示 ajaxDTdataType 选项集,以检索JSONP数据以在DataTables中进行服务器端处理。

名称 位置 办公室 扩展 开始日期 薪水
名称 位置 办公室 扩展 开始日期 薪水

下面显示的Javascript用于初始化此显示的表 example:

$(document).ready(function() { $('#example').dataTable( { "processing": true, "serverSide": true, "ajax": { "url": "scripts/jsonp.php", "dataType": "jsonp" } } ); } );

除上述代码外,以下Javascript库文件也已加载以供在本文档中使用。 example:

下面显示的HTML是原始HTML表格元素,之前已通过 DataTables:

除了从库中加载的内容外,此示例还使用了一些其他CSS 文件(如下),以便正确显示表格。显示了使用的其他CSS below:

加载以下CSS库文件以供本示例使用,以提供 table:

该表通过Ajax加载数据。下面显示了已加载的最新数据。这个数据 将在加载任何其他数据时自动更新。

下面显示了用于执行此表的服务器端处理的脚本。请注意 这只是使用PHP的示例脚本。服务器端处理脚本可以用任何形式编写 language, using 协议中描述的协议 DataTables文档.