Extjs4 AJAX API обновление магазина - PullRequest
2 голосов
/ 24 октября 2011

Я пытаюсь обновить свой магазин, а затем базу данных после использования целлетайтинга и поля со списком в сетке, чтобы обновить запись. Операция update.action в прокси-сервере ajax запускается корректно, просто хранилище и сетка не синхронизируются, а вкладка post в firebug говорит, что мой json выглядит так: 'data []'. Как я могу получить запись магазина, чтобы создать JSON и обновить запись? Спасибо за просмотр этого заранее ...

Ext.Loader.setConfig({
    enabled: true
});
Ext.Loader.setPath('Ext.ux', '/extjs4/examples/ux');
Ext.require([
    'Ext.layout.container.Fit',
    'Ext.grid.*',
    'Ext.data.*',
    'Ext.util.*',
    'Ext.panel.*',
    'Ext.selection.CellModel',
    'Ext.state.*',
    'Ext.form.*',
    'Ext.ux.CheckColumn']);

Ext.define('Ext.app.HirePlanGrid', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.hirePlangrid',
    hireplanstoreId: 'hireplanstore',
    hiremonthstoreId: 'hiremonthstore'

    ,
    renderMonth: function (value, p, record) {
        var fkStore = Ext.getStore(this.up('hirePlangrid').hiremonthstoreId);
        var rec = fkStore.findRecord("MONTH_ID", value);
        //return rec.get("ABBREVIATED_MONTH");
    }

    ,
    initComponent: function () {
        var rIdx = '';
        var cIdx = '';

        this.editing = Ext.create('Ext.grid.plugin.CellEditing', {
            clicksToEdit: 1,
            listeners: {
                'beforeedit': function (e) {
                    var me = this;
                    var allowed = !! me.isEditAllowed;
                    if (!me.isEditAllowed) Ext.Msg.confirm('confirm', 'Are you sure?', function (btn) {
                        if (btn !== 'yes') return;
                        me.isEditAllowed = true;
                        me.startEditByPosition({
                            row: e.rowIdx,
                            column: e.colIdx
                        });
                    });
                    rIdx = e.rowIdx;
                    cIdx = e.colIdx;
                    // alert('rIdx= ' + rIdx + ' cIdx = ' + cIdx);
                    return allowed;
                },
                    'edit': function (e) {
                    this.isEditAllowed = true;
                }
            }
        });

        var objMonthStore = Ext.getStore(this.hiremonthstoreId);
        objMonthStore.load();
        var objStore = Ext.getStore(this.hireplanstoreId);
        objStore.setProxy({
            type: 'ajax',
            url: 'hireplan.cfc?method=getEmployees'
        });

        objStore.load();

        var onDeleteClick = function (field, value, options) {
            // var objPanel = this.down('gridpanel');
            var selection = Ext.getCmp('grid').getSelectionModel().getSelection();
            // alert(selection);
            //var selection = getView().getSelectionModel().getSelection()[r];
            if (value) {
                //alert(value);
                objStore.remove(value);
                objStore.sync();
            }
        };
        var onUpdateClick = function (field, value, options) {
            alert('field= ' + field + ' value= ' + value + 'options= ' + options);
            objStore.update(this.hireplanstoreId, value, 'update', options);
            onSync();

        };
        var onSync = function () {
            objStore.sync();
        };

        Ext.apply(this, {
            layout: 'fit',
            width: 800,
            //height: 1500,
            items: [{
                xtype: 'grid',
                id: 'gridgrid',
                //height: 300,
                store: objStore,
                selModel: {
                    selType: 'cellmodel'
                },
                selType: 'rowmodel',
                plugins: [this.editing],
                // plugins: [cellEditing],
                columnLines: true,
                viewConfig: {
                    stripeRows: true
                },
                //loadMask: true,
                disableSelection: true,
                columns: [{
                    header: 'rowid',
                    hidden: true,
                    dataIndex: 'ROWID'
                }, {
                    header: 'Indicator',
                    id: 'chkcolumn',
                    xtype: 'checkcolumn',
                    dataIndex: 'CHK_COL',
                    editor: {
                        xtype: 'checkbox',
                        cls: 'x-grid-checkheader-editor'
                    },
                    listeners: {
                        checkchange: function (column, recordIndex, checked) {
                            alert('checked rindex= ' + recordIndex);
                            onDeleteClick(column, recordIndex, checked);
                            //or send a request                    
                        }
                    }
                }, {
                    id: 'employeeid',
                    header: 'employeeid',
                    width: 80,
                    hidden: false,
                    sortable: true,
                    dataIndex: 'EMPLOYEEID',
                    flex: 1
                }, {
                    id: 'NATIONALIDNUMBER',
                    header: 'NATIONALIDNUMBER',
                    width: 80,
                    sortable: true,
                    dataIndex: 'NATIONALIDNUMBER',
                    flex: 1
                }, {
                    id: 'MARITALSTATUS',
                    header: 'MARITALSTATUS',
                    width: 80,
                    sortable: true,
                    dataIndex: 'MARITALSTATUS',
                    flex: 1
                }, {
                    id: 'PotentialforInsourcingKV',
                    header: 'Potential for Insourcing',
                    width: 30,
                    sortable: true,
                    dataIndex: 'POTENTIAL_FOR_INSOURCING',
                    flex: 1,
                    editor: {
                        id: 'thiscombo',
                        xtype: 'combobox',
                        typeAhead: true,
                        triggerAction: 'all',
                        selectOnTab: true,
                        store: [
                            ['1', 'Yes'],
                            ['0', 'No']
                        ],
                        lazyRender: true,
                        listClass: 'x-combo-list-small',
                        listeners: {
                            scope: this,
                                'select': function () {
                                var selval = Ext.getCmp('thiscombo').getValue();
                                var row = rIdx;
                                //alert(selval + ' ' +  rIdx); 
                                onUpdateClick('thiscombo', rIdx, selval);
                            }
                        }
                    }
                }, {
                    id: 'ABBREVIATED_MONTH',
                    header: 'ABBREVIATED_MONTH',
                    width: 80,
                    sortable: true,
                    dataIndex: 'ABBREVIATED_MONTH',
                    flex: 1,
                    renderer: this.renderMonth,
                    field: {
                        xtype: 'combobox',
                        store: Ext.getStore(this.hiremonthstoreId),
                        typeAhead: true,
                        lazyRender: true,
                        queryMode: 'local',
                        displayField: 'ABBREVIATED_MONTH',
                        valueField: 'MONTH_ID',
                        listClass: 'x-combo-list-small'

                    }
                }, {
                    id: 'SALARIEDFLAG',
                    header: 'SALARIEDFLAG',
                    width: 80,
                    sortable: true,
                    dataIndex: 'SALARIEDFLAG',
                    flex: 1
                }],

                features: [{
                    ftype: 'rowbody'
                }]
            }]
        });
        this.callParent(arguments);
    }, //initComponent
    onSelectChange: function (selModel, selections) {
        this.down('#delete').setDisabled(selections.length === 0);
    },
    viewConfig: {},
});
// JavaScript Document
// JavaScript Document
hireplanstore = Ext.create("Ext.data.Store", {
    model: 'HiringPlan',
    //autoLoad: true,
    //autoSync: true,
    buffered: true,
    storeId: 'hireplanstore',
    remoteFilter: true

    ,
    proxy: {
        type: 'ajax',
        simpleSortMode: true,
        api: {
            read: 'hireplan.cfc?method=GetEmployees',
            update: 'hireplan.cfc?method=upEmployees',
            destroy: 'hireplan.cfc?method=delEmployees'
        },
        reader: {
            type: 'json',
            messageProperty: 'message',
            successProperty: 'success',
            root: 'data'
        },
        writer: {
            type: 'json',
            writeAllFields: false,
            root: 'data'
        },
        listeners: {
            exception: function (proxy, response, operation) {
                Ext.MessageBox.show({
                    title: 'ERROR from store',
                    msg: operation.getError(),
                    icon: Ext.MessageBox.ERROR,
                    buttons: Ext.Msg.OK
                });
            }
        }
    }


});
//hireplanstore.pageSize = 10000;       
Ext.define('HiringPlan', {
    extend: 'Ext.data.Model',
    fields: [{
        name: 'ROWID',
        type: 'string'
    }, {
        name: 'EMPLOYEEID',
        type: 'string'
    }, {
        name: 'NATIONALIDNUMBER',
        type: 'string'
    }, {
        name: 'MARITALSTATUS',
        type: 'string'
    }, {
        name: 'GENDER',
        type: 'string'
    }, {
        name: 'POTENTIAL_FOR_INSOURCING',
        type: 'integer'
    }, {
        name: 'ABBREVIATED_MONTH',
        type: 'string'
    }, {
        name: 'SALARIEDFLAG',
        type: 'string'
    }, {
        name: 'CHK_COL',
        type: 'bool'
    }]

});

1 Ответ

0 голосов
/ 09 мая 2012

Для правильного обновления вызов ajax или rest должен возвращать массив, содержащий обновленные записи, даже если это одна запись, вы должны возвращать ее внутри массива, пример ответа json (для остальных прокси) долженбыть таким:

[{'id': 1, 'name': 'test', 'foo': 'bar'}]
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...