javascript - 客户端从 IndexedDB 延迟加载到 DataTables jquery 插件

Question

我使用数据表已有一段时间了，但最近才开始使用 IndexedDB。在大多数情况下，两者可以很好地协同工作，但是，我遇到了一些问题。

我想做的是从本地数据库加载数据，但不是一次加载所有数据。原因是它加载了数千条非常慢的记录。相反，我想用 indexedDB 做我一直在服务器端做的事情——在那里我发送了一大块记录和实际有多少记录的总数。 DataTables 能够使用这两条信息来正确分页。

但是，这使用了带有 url 的 fnAjaxSource 选项。我需要采用一个以某种方式返回数据的函数。我还没有发现有人在做完全相同的事情。目前我正在为该项目使用 DataTables 1.9，但是，如果需要，我可以为这个页面和类似页面使用 1.10。但是，通过 API 和文档并没有向我展示任何告诉 DataTables 期望比它接收到的记录更多的方法。如果您需要我提供任何其他信息，请告诉我，但我无法真正发布示例，因为我不知道自己在做什么。我希望有一个简单的选择，或者我可以通过某种方式编写一个插件来执行此操作，但我还没有看到任何给我希望的东西。

I have asked the question similarly on the DataTables forum here.

我应该澄清一下，我对 IndexedDB 真的没有问题。我很好地以 block 的形式加载我的数据，以及获取满足我的搜索条件的记录总数。问题在于 DataTables 需要所有数据，而不仅仅是一个 block ，以便了解将存在多少条记录以及如何进行分页。

Answer 1

从 1.10 开始，您可以在初始化 DataTable 时为 ajax 选项传递一个函数。 ajax documentation有详细资料

As a function, making the Ajax call is left up to yourself [...] if desired, a method other than Ajax could be used to obtain the required data, such as Web storage...

When the data has been obtained from the data source, the second parameter (callback here) should be called with a single parameter passed in - the data to use to draw the table.

本质上:

$('#example').dataTable( {
  ajax: function (data, callback, settings) {
    // ... retrieve data using parameters in `data` ...
    // ... transform result into format expected by callback ...
    callback(transformed_result);
  }
});

此外，如果您还启用 server-side processing , 然后传递给你的函数的 data 参数也将包括属性 start, length 等可以用来限制记录的数量你从 IndexedDB 请求。