javascript 如何保持 ExtJS 数据网格列隐藏/显示/移动/调整大小？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5557832/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I persist ExtJS datagrid column hiding/showing/moving/resizing?
提问by Christos Hayward
I would like to make a user's changes to an ExtJS datagrid's column display (hiding, showing, moving, resizing) persistent and stored on the server. There are a lot of events to listen to, but registering handlers on the grid itself doesn't seem to result in alerts being called:
我想让用户对 ExtJS 数据网格的列显示（隐藏、显示、移动、调整大小）的更改持久化并存储在服务器上。有很多事件要侦听，但是在网格本身上注册处理程序似乎不会导致调用警报：
grid.on('hide', function(event)
{
alert('Save column order: column hidden.');
});
grid.on('move', function(event)
{
alert('Save column order: column moved.');
});
grid.on('resize', function(event)
{
alert('Save column sizes: column resized.');
});
grid.on('show', function(event)
{
alert('Save colum order: column shown.');
});
(My basic approach may or may not be optimal.)
（我的基本方法可能是也可能不是最佳的。）
What concretely should I do to be listening in on these events? I can hide, show, move, and resize columns without triggering an alert.
我具体应该怎么做才能监听这些事件？我可以在不触发警报的情况下隐藏、显示、移动和调整列大小。
回答by Amol Katdare
First, you need to configure a state provider.
CookieProvideris the only one that comes built in with ExtJS
首先，您需要配置一个状态提供程序。
CookieProvider是 ExtJS 中唯一内置的
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
Second, mark yourGridPanel.statefulas true
其次，标记yourGridPanel.stateful为true
Third, look at whether you need to change the default for GridPanel.stateEvents
This is basically "An array of events that, when fired, should trigger this component to save its state"
第三，查看是否需要更改GridPanel的默认值。stateEvents
这基本上是“一组事件，当触发时，应触发此组件以保存其状态”
Fourth, HttpStateProvider does not come built in with ExtJS but Sakihas a ux (user extension) for it.
第四， HttpStateProvider 没有内置在 ExtJS 中，但Saki有一个ux（用户扩展）。
Fifth, if you want to save states of multiple components they should have either idor stateIdexplicitly set.
第五，如果你想保存多个组件的状态，它们应该有id或stateId显式设置。
A good approach would be to get this working as expected with the built in CookieProviderand then switch over to Http Provider.
一个好的方法是使用内置的CookieProvider 使其按预期工作，然后切换到Http Provider。
回答by DWRoelands
The grid should have a property called "stateful". Set this to True and the grid should remember the column widths, etc.
网格应该有一个名为“有状态”的属性。将此设置为 True，网格应该记住列宽等。
回答by jd.
Configure the grid with stateful: trueand set its stateId(optional if your grid has an ID that won't change). Also initialize the Ext.state.Manager:
配置网格stateful: true并设置它stateId（如果你的网格有一个不会改变的 ID，则可选）。还要初始化 Ext.state.Manager：
var thirtyDays = new Date(new Date().getTime()+(1000*60*60*24*30));
Ext.state.Manager.setProvider(new Ext.state.CookieProvider({expires: thirtyDays}));
Though not included in Ext 3, you can find online a state provider that uses HTML5's localStoragerather than cookies.
虽然不包含在 Ext 3 中，但您可以在线找到使用 HTML5localStorage而不是 cookie的状态提供程序。
