ext4关于store更新的经典疑难问题

Question

不是这么用的 
store有个方法叫做insertinsert( Number index, Ext.data.Model[] records )
Inserts Model instances into the Store at the given index and fires the add event. See also add.Parameters
index : Number
The start index at which to insert the passed Records.
records : Ext.data.Model[]
An Array of Ext.data.Model objects to add to the store.

Answer 1

你没看懂我的意思啊，也没认真看我的代码，这里跟服务器没关系的，都是用本地的数据。
按你说的插入一条，插入是插入成功了，但是列表还是没有更新呢，跟直接改为store没区别的，一样无效果。
var record = {id: "3", name: "name3"};
test.store.insert(2, record );//store中插入一条，经测试，插入成功了。即alert(test.store.getCount())值为3，此是有三条记录。
test.store.load();//依然无效
再说下，本题不说ajax啊什么的，纯本地数据测试。要实现的功能就是，改变原列表中的store值，并更新数据。（改变值是没问题的了，无论直接改变store的，还是插入，删除，增加记录，现在是更新不了列表，这个是大问题）

Answer 2

此问题真的没什么人研究啊？
看来，学ext4的人，太少了，哎

Answer 3

调用doLayout更新视图
test.doLayout();

Answer 4

还有更新store的方式有问题,你那样直接构造一个新store的方式不是更新,是把store重新赋值了都,store属性这样直接写入当然并不能带来更新,你要知道,js里面是不支持属性的读写逻辑的,所以写入一个属性绝对不会带来视图上的任何更新,并需调用函数才可能更新视图.
你用更新store的record的方式更新数据源,不要构造新的store,更换了store的record后调用doLayout,就可以更新了

Answer 5

直接更新了record的就行了？改天再试下看了，我感觉应该没那么简单啊。
还有那个doLayout();似乎作用不大。

Answer 6

简单试了下，只改record还真有效果，高人啊。
不过，加没加doLayout();都一样能更新的，doLayout();看来真的成了鸡肋了。
非常感谢，解决了困扰我两天的问题了。

Answer 7

我是楼主，昨天不小心回了三个，回不了了，所以换了个号
我发现另外的问题，再补充下了。
问题基本上可以通过更改record达到更新store的目的，但我又另发现一个问题，如果原store中的记录数小于要更改的条数，那么，用这种更改record的方式就不适用了，因为，下标不够用。
store.getAt(i).set("name", "newname");
i的值为原store个数减1，很显然，新的超过时就受限了。
看来，这个问题还没完， 那么简单……
不知道有没更好的办法，比如克隆之类的方法等，我也看了store的api似乎没有更好的

Answer 8

store.getAt(i).set("name", "newname");楼主这里的为什么要先getAt()呢,直接set('','')这样行吗?如果可行getAt()记录数的问题就不存在了,
6楼不是说最好构建一个record,然后替换掉..可以试试啊

Answer 9

你的意思是这样：store.set("name", "newname");？这样肯定不行啊，store根本就没有 set方法的，set方法只用于记录record
6楼说的构建record就是我那个意思了，改变原store中的record,就是用：store.getAt(i).set("name", "newname");这行方法，没别的了。
这种方法一个问题是，下标越界时，无效了，现在要解决这个问题。。

Answer 10

我想，这里要真正解决问题，可能要涉及到dom操作了，这个就麻烦了，对这方面不熟

Answer 11

更改record的方式是不会错的，
store实际是一个集合，可以添加成员和移除成员，该集合提供的操作方法是很完备的：
移除成员：remove、removeAt，removeAll
添加成员：add，insert
所以你说的新的记录数与原记录数不等时就没法处理的说法是莫名其妙的，
你先用removeAll移除所有record，再用add方法把新的record一添加进去就行了
这种小问题无需操作dom

Answer 12

按正常的思维确实是你这样子认为的，改了store就好了，数据马上就变化了，增删改。
可是，可是，不知你试过没呢？改变了store的，列表会更新吗？别再说用test。doLayout()了，根本没效果啊。
如果你试过了，你会发现，store增删改，确实做到了，但是，列表中的数据，根本就不会实现更新啊。
这上面我都说得很清楚的了，不然我也不好意思叫什么经典store问题啊？
只能更改store中的record记录，才可以实现列表更新。用这个方法，store.getAt(i).set("name", "newname");
只是，下际会超出，就没效果了。

Answer 13

http://www.iteye.com/problems/89262
这个是我在javaeye上的提问，也没有人知道，你有兴趣的话，可以把上面的代码放在本地测试一下就知道了。
至于那个插件，去ext4里面的ux目录下找吧。

Answer 14

毛，更改store的情况做ext时用的多了，从没说没法更新的，
移除原有记录，添加新纪录的方式绝不会有问题实在不行，把显示grid的代码写成一个函数，需要更新时关闭原grid（从其容器组件中移除该对象就行了）对象，调用函数重新生成一个grid也就是了（不过这种方法记得调用其容器组件的doLayout），从没见被更新问题给拦着就不知所措的，
方法都是想出来的，多想想，哪有解决不了的问题

Answer 15

ext的控件和数据源绑定了的，只要修改对应的store，会自动更新ext的控件

Answer 16

你啊，这么自信，又没认真看题，想当然了，呵
我这里用的控件是boundlist或者itemselector，不是grid。
好吧，我麻烦点，看下能否弄个完整的可测试，到时，你在机子上试下就知道了，看下，会不会更新，想当然没用啊。我也是想当然认为：:test.store.add(record);test.store.insert(i,record);test.store.removeall();就好了，可实际的情况却是不行啊。

Answer 17

这位老兄也是想当然了，待我弄个测试代码上来，或者你看下，能不能用：http://www.iteye.com/problems/89262
http://www.iteye.com/problems/89262
这里的例子

Answer 18

看了你给的网址了，我感觉我先前的都白说了，
你都把store重新赋值了，操作的根本就不是原来的store对象了，你还指望更新？
"不要构造新的store",这一楼的回答不知你怎么理解的，看到你还是重新构造了一个store代替了原来的......
被重新赋值后，test.store已经不是配置时产生的那个store了，明白么？你对test.store做的任何操作都不会作用在原来的store上，所以是无法产生作用的。先把这个问题搞清楚吧

Answer 19

还有你说我不审题的问题，但grid也是用store作为数据源的，其实更新数据的方式根本就一样，我以grid为例有问题么？
还有我说的第二种方式，难道不是grid你就不能把生成boundlist组件的代码写成函数，然后用我所说的方法进行动态更新了？？

Answer 20

还有请不要在那个网站说：
“这个问题在csdn上也问过”，搞的大家以为csdn上没人会这个了，
只是你自己没能理解大家所说，说到底还是ext基础不够，js面向对象的基础不够罢了

Answer 21

test.store已经不是配置时产生的那个store了
那请问，配置时的那个store，用什么办法取出来呢？
test为配置时那个对象，这个应该没问题，如果配置时的那个store不从test这个对象里边取，那还能怎么取？请指教。
你不会说用test.getStore();取原来的store吧？这样取也不行啊，这样取改变store的值依然无更新的

Answer 22

22楼理论分析得有点道理了，但是问题还是没能解决。
他说，我取出的store不是原来配置时的那个store，所以更改store无法更新数据。
我是用这样取store的：
var test = Ext.getCmp("test");
store = test.store
后来，我要用getStore()来取原来的store，我发现，跟test.store这样取，一样的没效果。
实在想不出还能怎么取了。
其实，我现在是有点怀疑ext的设计机制的了
按理说，store只是数据集合而已，不应该跟界面有关系的，改变store的，再更新（刷新）下组件（控件），数据就应该更新出来才是，但是test.doLayout()又没效果，真是费解ps:如果不是本地的数据，我用服务端下载的，我可以直接用：store.proxy.url = url进入更新的，但本的，就无所谓url的了，所以，这招行不通。

Answer 23

不晓得你用什么样的逻辑可以把我的话理解为store不从test里面取......
我的意思是你不要运行
test.store=newStore的代码；我还是直接给你个代码吧，我的描述已经被你歪曲得不成样子了var test = Ext.getCmp("test");
var store=test.getStore();
store.removeAll();
var records=[{id:'3',name:'name3'},{id:'4',name:'name4'}];
for(var i=0;i<records.length;i++)
{
 arecord=new Ext.data.Record(records[i]);
 store.add(arecord);
}就这样就行了，虽然未测试，但目测无问题
但你不要再按自己的理解乱改了，先就按这个代码测试

Answer 24

很遗憾的告诉你----无效！
首先要说的是，ext4中，没有Record这个类了，改为Model,
其次，先不管Record，还是Model
照你的意思来说，以下这三句，就可以把原数据列表清空了吧？
var test = Ext.getCmp("test");
var store=test.getStore();
store.removeAll();
但是，相当遗憾，原来是name1,name2的数据，这三句走完后，还是name1,name2的数据
即根本没动静，不会更新数据列表。
所以，你这样子的方法test.getStore();来取store，这个store，依然还不是原始的store的呢，因此，才removeAll()也没法清空。
请问，这怎么破？？？原始的store对象怎么取呢？

Answer 25

<script>    function c() {
        var test = Ext.getCmp("test");
        var store = test.getStore();
        store.removeAll();
        var records = [{ id: '3', name: 'name3' }, { id: '4', name: 'name4'}];
        for (var i = 0; i < records.length; i++) {            store.add(records[i]);
        }
    }
    Ext.create('Ext.form.ComboBox', {
        id: 'test',
        fieldLabel: 'Choose State',
        store: Ext.create('Ext.data.Store', {
            fields: ['id', 'name'],
            data: [{ id: "1", name: "name1" }, { id: "2", name: "name2"}]
        }),
        queryMode: 'local',
        displayField: 'name',
        valueField: 'id',
        renderTo: Ext.getBody()
    });
</script>楼主我来回答你的问题吧，当你指定比如combo的store为具体某个store对象后，据我查阅过api是无法重新绑定新的store。
但是有些组件可以
比如grid，它使用的方法是reConfigure  这个方法。 
所以如果你非得要自己重新绑定store，那么这个就得你自己去扩展一个方法了，我相信grid可以做到reConfigure  ，那么你也由能力可以做到.而实际上对于你的需求真没必要那么做，请试验一下我写的代码吧，基本上是在wzs_xyz兄弟上做下修改而已。。

Answer 26

其实我真不想反复地说这么个简单的问题
我想直接写段测试过的代码，但ext版本不支持itemselector，也不知道该下载那个版本的才支持
用个其他组件代替的话楼主肯定不信，要认为那个组件特殊些，我也没办法

Answer 27

ext的ux有点bug吧，虽然API文档里面itemselector有getStore方法，但是实例调用的时候输出undefined。还有就是itemselector这个组件视乎没有添加数据源的更新事件，当数据源更新的时候自动更新ui。itemselector可以使用bindStore方法重新绑定数据源就好了
    function c() {
        store.removeAll();
        var records = [{ id: '3', name: 'name3' }, { id: '4', name: 'name4'}];
        for (var i = 0; i < records.length; i++) {            store.add(records[i]);
        }        itemselector.bindStore(store)//重新绑定数据源
    }
    Ext.onReady(function () {
        store = Ext.create('Ext.data.Store', {
            fields: ['id', 'name'],
            data: [{ id: "1", name: "name1" }, { id: "2", name: "name2"}]
        });
        itemselector = Ext.create("Ext.ux.form.ItemSelector", {
            id: "test",
            height: 300,
            width: 400,
            displayField: 'name',
            valueField: 'id',
            renderTo: document.body,
            //因为调用不了getStore，所以数据源要传递变量而不是直接创建
            store:store /*Ext.create('Ext.data.Store', {
                fields: ['id', 'name'],
                data: [{ id: "1", name: "name1" }, { id: "2", name: "name2"}]
            })*/
        });
        alert(itemselector.getStore)//输出undefined。。神奇了，应该是没有完善这个组件
    });
<input type="button" value="更换" onclick="c()" />

Answer 28

老兄你这次才是正解啊，非常感谢，原来是控件的bug，在这里讨论了，半天，差点都吵起来了，呵呵
用了bindStore后，完美解决这个bug...
本来都快弄好了测试项目了，现在就不用弄了，省心了。

Answer 29

31楼完美解决了，不过，也很感谢你的热情参与的。
本来store增删改的问题确实是简单的问题啊，但是无奈，itemselector的控制质量有问题，按正常的思路来做，就是没效果，所以，我才会认为，变得不简单了。
再次感谢所以热情帮忙的朋友，贴子结了，给后人一个参考吧。。

Answer 30

你没看懂我的意思啊，也没认真看我的代码，这里跟服务器没关系的，都是用本地的数据。
按你说的插入一条，插入是插入成功了，但是列表还是没有更新呢，跟直接改为store没区别的，一样无效果。
var record = {id: "3", name: "name3"};
test.store.insert(2, record );//store中插入一条，经测试，插入成功了。即alert(test.store.getCount())值为3，此是有三条记录。
test.store.load();//依然无效
再说下，本题不说ajax啊什么的，纯本地数据测试。要实现的功能就是，改变原列表中的store值，并更新数据。（改变值是没问题的了，无论直接改变store的，还是插入，删除，增加记录，现在是更新不了列表，这个是大问题）test.store.insert(2, record );这句本身没有什么问题的，但是store要设置为autoLoad：true。

Answer 31

grid有个方法叫reconfigure.你现在就是要将一个新的store数据集合放到一个grid。grid.reconfigure(newStore)