使数据表与Turbolink一起使用 | 使数据表与Turbolink一起使用

本文介绍了使数据表与Turbolink一起使用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想在我的Web应用程序中使用Turbolinks.但是，我在使用涡轮链接和数据表时遇到了一些麻烦.

I would like to use Turbolinks in my web application. However, i have some troubles with turbolinks and datatables.

确实，当我第一次加载数据表时，它会为其生成DOM，一切正常.但是使用turbolinks时，页面将与生成的DOM一起缓存，因此当我更改页面并返回我的数据表时，所有数据表功能均不起作用(分页，排序，过滤器...)

Indeed, when i load my datatable for the first time, it generate the DOM for it and everythings is ok. But with turbolinks, the page is cached with the generated DOM and so when I change page and return on my datatable, all datatable feature doesn't works (paging, order, filter ...)

我认为，在已经生成DOM时重新加载数据表是行不通的，所以我试图在重新加载它之前销毁它:同样的问题

I think, reload the datatable when its DOM is already generated doesn't work, so i tried to destroy it before reload it : same problem

这是我的数据表函数:数据表功能

Here it's my datatable function :Datatable function

这里是对它的调用:对其进行调用

您遇到过这个问题吗，我该怎么解决?

Have you ever met this problem and what can i do to resolve it ?

感谢您的回复

推荐答案

从Turbolink缓存返回时，请勿再次初始化日期表.

Do not initial the datetables again when return back from turbolink cache.

document.addEventListener("turbolinks:load", function() {
  "use strict";
  if ($("#users-table_wrapper").length == 0) {
    $('#users-table').DataTable();
  }
})

这篇关于使数据表与Turbolink一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！