Question

我在表单中有一个网格面板。网格面板的任何行都有一个文件字段。我想将任何行（名称字段和文件名字段）发送到服务器。

模型：

Ext.define('FM.model.DefineCode', {
    extend: 'Ext.data.Model',

    fields: [
        {name: 'id',  type: 'int'},
        {name: 'name',  type: 'string'},
        {name: 'filename',  type: 'string'}
    ],
    validations: [
        {type: 'presence',  field: 'id'},
        {type: 'presence',  field: 'name'},
        {type: 'presence',  field: 'filename'}
    ]
});

商店：

Ext.define('FM.store.DefineCode', {
    extend: 'Ext.data.Store',
    model: 'FM.model.DefineCode',
    autoLoad: true,
    data: []
});

查看：

Ext.define('FM.view.map.DefineCode', {
    extend: 'Ext.window.Window',
    title: 'Define Code',
    alias: 'widget.mmDefineCode',
    width: 600,
    modal: true,
    items: [{
        xtype: 'form',
        items: [{
            xtype: 'gridpanel',
            title: 'myGrid',
            store: 'DefineCode',
            columns: [
                {
                    text: 'Id',
                    xtype: 'rownumberer',
                    width: 20 
                }, {
                    text: 'Name',
                    dataIndex: 'name',
                    flex: 1, 
                    editor:{
                        xtype: 'textfield'
                    }
                }, {
                    text: 'File', 
                    dataIndex: 'filename', 
                    width: 200,
                    editor:{
                        xtype: 'filefield',
                        emptyText: 'Select your Icon',
                        name: 'photo-path',
                        buttonText: '',
                        flex: 1,
                        buttonConfig: {
                            iconCls: 'icon-upload-18x18'
                        },
                        listeners: {
                            change: function(e, ee, eee) {

                                var grid = this.up('grid');
                                var store = grid.getStore();
                                var newStore = Ext.create('FM.store.DefineCode',{});
                                store.insert(store.data.items.length, newStore);
                            }
                        }
                    },
                }, { 
                    text: '', 
                    width: 40 
                }
            ],
            height: 200,
            width: 600,
            plugins: [
                Ext.create('Ext.grid.plugin.CellEditing', {
                    clicksToEdit: 1
                })
            ]}
        ],
    }],
    buttons: [{text: 'OK', action: 'OK'}],
    initComponent: function() {
        var me = this;


        Ext.apply(me, {});
        me.callParent(arguments);
    }
});

控制器：

...
form.submit({
    url: 'icon/create',
});

当我提交表单时，只有最后一行发送到服务器。哪里有问题？

Answer 1

为什么要使用它？

var newStore = Ext.create('FM.store.Path', {});
store.insert(store.data.items.length, newStore);

尝试使用rowEditing编辑/提交1行数据：

var rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
    clicksToEdit: 2,
    clicksToMoveEditor: 1,
    listeners: {
        'validateedit': function(editor, e) {},
        'afteredit': function(editor, e) {
            var me = this;
            var jsonData = Ext.encode(e.record.data);
            Ext.Ajax.request({
            method: 'POST',
            url: 'your_url/save',
            params: {data: jsonData},
            success: function(response){
                e.store.reload({
                    callback: function(){
                        var newRecordIndex = e.store.findBy(
                            function(record, filename) {
                                if (record.get('filename') === e.record.data.filename) {
                                    return true;
                                }
                                return false;
                            }
                        );
                        me.grid.getSelectionModel().select(newRecordIndex);
                    }
                });
            }
        });
            return true;
        }
    }
});

并将其放入您的插件中。我不先试试，但可能会对你有所帮助。

这是你的控制器从你的网格添加一个记录，你需要一个按钮来触发这个功能。

createRecord: function() {
    var model = Ext.ModelMgr.getModel('FM.model.DefineCode');
    var r = Ext.ModelManager.create({
        id: '',
        name: '',
        filename: ''
    }, model);
    this.getYourgrid().getStore().insert(0, r);
    this.getYourgrid().rowEditing.startEdit(0, 0);
}

检查this是否需要，这看起来像。您需要指定内容类型。

对于您的java需求，请阅读this方法上传文件。

使用Extjs表单提交所有网格行

1 个答案: