Question

Proxy update on ExtJS is not loading my update API instead it loads URL which I use to display data on GRID.

<script type="text/javascript">

Ext.onReady(function () {

    var CoventryItemListStore = new Ext.data.Store({
        storeId: CoventryItemListStore,
        autoSave: true,
        writer: new Ext.data.JsonWriter(),
        reader: new Ext.data.JsonReader({
            idProperty: 'id',
            root: 'variables'
        }, [{
            name: 'id'
        }, {
            name: 'itemid'
        }, {
            name: 'triggerQuantity'
        }, {
            name: 'lastUpdatedBy'
        }, {
            name: 'lastUpdatedOn'
        }]),
        proxy: new Ext.data.HttpProxy({
            method: 'POST',
            prettyUrls: false,
            url: '/admin/loadCoventryItemApprovalList.epm',
            api: {
                update: '/admin/updateCoventryItemApprovalList.epm'
            }
        }),
        listners: {
            'write': function (store, action, result, res, rs) {
                if (action == 'update') {
                    var newId = res.raw.newId;
                    var oldId = res.raw.oldId;
                    if (newId != oldId) {
                        CoventryItemListStore.reload();
                    }
                }
            }
        }
    });

    CoventryItemListStore.load();

    var fm = Ext.form;

    var CoventryItemListGridUi = Ext.extend(Ext.grid.EditorGridPanel, {
        title: 'Coventry Item List',
        store: CoventryItemListStore,
        width: 980,
        height: 650,
        renderTo: 'coventryDiv',
        defaults: {
            width: 280
        },
        defaultType: 'textfield',
        stripeRows: true,
        //  reader: CoventryItemListReader,
        autoExpandColumn: 'coventryListCol',
        align: 'center',
        clicksToEdit: 1,
        initComponent: function () {
            this.columns = [{
                xtype: 'gridcolumn',
                header: 'ID',
                sortable: true,
                dataIndex: 'id'
            }, {
                xtype: 'gridcolumn',
                header: 'ITEM ID',
                sortable: true,
                width: 250,
                align: 'center',
                dataIndex: 'itemid'

            }, {
                xtype: 'gridcolumn',
                header: 'TRIGGER QUANTITY',
                sortable: true,
                // id: 'ftpCol',
                width: 200,
                align: 'center',
                dataIndex: 'triggerQuantity',
                editor: {
                    xtype: 'numberfield'
                }

            }, {
                xtype: 'gridcolumn',
                header: 'LAST UPDATED BY',
                sortable: true,
                width: 80,
                align: 'center',
                dataIndex: 'lastUpdatedBy',
                id: 'coventryListCol'
            }, {
                xtype: 'gridcolumn',
                header: 'LAST UPDATED ON',
                sortable: false,
                width: 100,
                align: 'center',
                dataIndex: 'lastUpdatedOn',

            }];

            this.listeners = {
                'afteredit': function (e) {
                    params: {
                        var oldVal = e.originalValue;
                        var newVal = e.value;
                        var fieldName = e.field;
                        var itemID = e.record.get("itemid");
                    }
                    alert('Field \'' + fieldName + '\' changed from \'' + oldVal + '\' to \'' + newVal + '\'.(itemID: ' + itemID + ')');
                }
            }

            var itemsPerPage = 100;
            this.bbar = new Ext.PagingToolbar({
                pageSize: itemsPerPage,
                autoLoad: true,
                store: CoventryItemListStore,
                displayInfo: true,
                displayMsg: 'Displaying categories {0} - {1} of {2}',
                emptyMsg: "No categories to display"
            });

            this.tbar = new Ext.Toolbar({
                xtype: 'toolbar',
                items: [{
                    xtype: 'textfield',
                    id: 'searchValue'
                }, {
                    xtype: 'button',
                    text: 'Search',
                    style: 'marginLeft: 5px',
                    enableToggle: true,
                    handler: function () {
                        vms.reload({
                            params: {
                                searchValue: Ext.getCmp('searchValue').getValue()
                            }
                        });
                    }
                }]
            });

            CoventryItemListGridUi.superclass.initComponent.call(this);
        }
    });

    new CoventryItemListGridUi();

});

</script>

Answer 1

well re posting the answer for better visibility

proxy: new Ext.data.HttpProxy({ method: 'POST', prettyUrls: false, url: '/admin/updateCoventryItemApprovalList.epm', api: { read: '/admin/loadCoventryItemApprovalList.epm' } })