Ext JS 增删改 Ext.Net.Store详细教程

本文内容
引入
演示用 Ext JS 增删改 Ext.Net.Store
说明
参考资料
 

引入
当我使用 Ext.Net 时，始终不能摆脱最初开发 asp.net 应用程序的方式，也就是，前后台的交互。当你用 asp.net 的思维方式，开发 Ext.Net 时，你会发现应用程序问题很多，我所见过的，比如，页面闪的厉害（刷新次数太多，虽然也是局部刷新）；页面脚本错误；页面 CSS 错误等等。这充分说明，错误地使用了 Ext.Net。没有理解 Ajax。知道与会用往往是两回事。

现在，我既不想使用 asp.net 近乎全部刷新页面的方式（虽然可以完全做到局部刷新，但还是不够方便，尤其是对开发），也不想使用类似 jQuery+HTML 的局部刷新，因为这要写太多脚本。

Ext.Net 这个 Ajax 框架，提供了一个很好的方式。让你在脚本代码与后台代码做出权衡。因为，Ext.Net 是用 .Net 封装的 Ext JS，你可以使用 Ext.Net，也可以随意写 Ext JS 代码。

比如，用 Ext.Net 向页面拖放控件，而不是写一堆 Ext JS 脚本来创建，并在必要时，编写 Ext JS 脚本操作页面元素。所有操作都是前台进行，最后才发送给服务器端。

演示用 Ext JS 增删改 Ext.Net.Store
GridPanel 标记
假设页面有个 Ext.Net.GridPanel 和 Ext.Net.Store。但在页面初始化（第一次初始化）时，不加载任何数据，store 也没有 OnRefreshData 事件。

操作 store 的按钮标记

用 Ext JS 增删改 Store

下面演示用 Ext JS 增删改 store。

可以做个类比，Store 相当于 .net framework DataTable，而 Record 相当于 DataRow。

说明

官网 add 方法的原型是：add( Object data ) : Array。与 insert 方法不一样。按理说应该一样的。个人觉得官网笔误，试了半天报错。按 insert 的参数就没问题了。

其实，在我看来，用 Ext JS 直接操作 Ext.Net.Store 意义不大，除非你想把 store 单纯地作为一个数据缓存容器，不在页面呈现。因为，往往操作 grid 同时，就是在操作 store，而且通过 grid 操作 store，会在页面上看到数据式样的变化（当你编辑 grid 某列的数据后，其右上角有个红色三角）。

但是，了解直接操作 store，会加深通过 grid 操作 store 的理解。

本例的 store 是 ArrayReader，也可以使用 JsonReader。

但是数据需要改成类数组，而不是前面数组的数组。