动态加载数据到网格

Question

我需要帮助。当我用数据创建新网格时，我有带工具栏的网格（通过工具栏中的按钮打开 window 创建）仅在重新加载页面后才显示新行我看到了新行。谢谢。

这是商店：

var writer = new Ext.data.JsonWriter({
    type: 'json',
    encode: false,
    listful: true,
    writeAllFields: true,
    returnJson: true
});


var reader = new Ext.data.JsonReader({
    totalProperty: 'total',
    successProperty: 'success',
    idProperty: 'Id',
    root: 'Data',
    messageProperty: 'message'
});


var proxy = new Ext.data.HttpProxy({
    reader: reader,
    writer: writer,
    type: 'ajax',
    api: {
        read: '/Item/Get',
        create: '/Cart/CreateCart',       
        update: '/Cart/CreateCart',
        destroy: '/Cart/CreateCart',
        add: '/Cart/CreateCart'
    },
    headers: {
        'Content-Type': 'application/json; charset=UTF-8'
    }
});


Ext.define('ExtMVC.store.Items', {
    extend: 'Ext.data.Store',
    model: 'ExtMVC.model.Item',
    autoLoad: true,
    paramsAsHash: true,
    autoSync: true,
    proxy: proxy    
});

这是创建方法：

additem: function (button) {
        var win = button.up('window'),
            form = win.down('form'),
            values = form.getValues();
        Ext.Ajax.request({
            url: 'Item/CreateItem',
            params: values,
            success: function (response, options) {
                var data = Ext.decode(response.responseText);
                if (data.success) {
                    Ext.Msg.alert('Create', data.message);                    
                }
                else {
                    Ext.Msg.alert('Create', 'Creating is faild');
                }
                win.close();
            }
        });
    }

Answer 1

在您的函数 addItem 中，您将数据（记录）添加到您的数据库，而不是将此记录添加到存储（绑定到网格）。

因为您将数据保存到数据库中，所以它会在您重新加载后加载到商店（并显示在网格中）。

您可以通过以下方式将记录添加到您的店铺：

var win = button.up('window'),
form = win.down('form'),
values = form.getValues();

var store = *referenceToYourGrid*.getStore();
var model = Ext.ModelMgr.getModel(store.model);
var record = model.create();

record.set(values);

store.add(record);

现在它应该会显示在您的商店中。您可以 store.insert(0, record) 代替 store.add 将记录插入特定位置。在这种情况下作为第一条记录（位置：0）。 Store.add 会将记录放在存储（和网格）的末尾。您可以 store.sync() 将记录保存到数据库而不是 Ajax 请求。您已经配置好代理 api 属性。

动态加载数据到网格

Dynamically load data to grid

extjs4