Layui表格筛选列不随页面刷新重置
时间: 2023-07-28 13:10:04 浏览: 171
如果您想让Layui表格的筛选列在页面刷新后不被重置,可以使用一些技巧。其中一种方法是使用浏览器的本地存储(LocalStorage)来存储表格的筛选条件。下面是一个简单的实现方案:
1. 在表格渲染之前,从本地存储中获取上一次保存的筛选条件。
2. 将筛选条件传递给表格的配置项中,以便在表格渲染时自动应用这些筛选条件。
3. 在表格的筛选事件中,将当前的筛选条件保存到本地存储中。
下面是一个示例代码:
```javascript
// 获取上一次保存的筛选条件
var filters = JSON.parse(localStorage.getItem('table-filters')) || {};
// 渲染表格
table.render({
// ...
where: filters, // 将筛选条件传递给配置项
done: function(res, curr, count) {
// 渲染完成后,保存当前的筛选条件
localStorage.setItem('table-filters', JSON.stringify(table.where));
}
});
// 监听筛选事件
table.on('filter', function(obj) {
// 保存当前的筛选条件
localStorage.setItem('table-filters', JSON.stringify(obj.where));
});
```
这段代码使用了LocalStorage来存储表格的筛选条件。在表格渲染时,先从LocalStorage中获取上一次保存的筛选条件,然后将其传递给表格的配置项中。在表格的筛选事件中,将当前的筛选条件保存到LocalStorage中。这样,即使页面刷新,表格的筛选条件也会被保留下来。
阅读全文