2

我很难让分页工具栏工作。初始加载将“start”和“limit”参数传递给服务器代理，数据在网格中加载良好。但是，当单击分页工具栏中的“下一步”按钮时，“开始”和“限制”参数无法正确传递，并且 Web 方法会因为它需要这些参数而崩溃。如果你能帮我解决根本问题，那就太棒了。但如果没有，并且您可以帮助我覆盖按钮，那也很好，所以我可以进行临时修复，直到找出问题所在。

例外：

POST http://{domain}/Controls/ObjectList/ObjectListService.asmx/GetObjectList?_dc=1348591244365 500 (Internal Server Error) ext-all-debug.js:36837
Ext.define.request                  ext-all-debug.js:36837
Ext.define.doRequest                ext-all-debug.js:49508
Ext.define.read                     ext-all-debug.js:39082
Ext.define.load                     ext-all-debug.js:47668
Base.implement.callParent           ext-all-debug.js:3728
Ext.define.load                     ext-all-debug.js:50160
Ext.define.read                     ext-all-debug.js:47399
Ext.define.loadPage                 ext-all-debug.js:50404
Ext.define.nextPage                 ext-all-debug.js:50409
Ext.define.moveNext                 ext-all-debug.js:102105
Ext.define.fireHandler              ext-all-debug.js:79530
Ext.define.onClick                  ext-all-debug.js:79520
(anonymous function)
Ext.apply.createListenerWrap.wrap   ext-all-debug.js:9171

{"Message":"Invalid web service call, missing value for parameter: \u0027query\u0027.","StackTrace":"   at System.Web.Script.Services.WebServiceMethodData.CallMethod(Object target, IDictionary`2 parameters)\r\n   at System.Web.Script.Services.WebServiceMethodData.CallMethodFromRawParams(Object target, IDictionary`2 parameters)\r\n   at System.Web.Script.Services.RestHandler.InvokeMethod(HttpContext context, WebServiceMethodData methodData, IDictionary`2 rawParams)\r\n   at System.Web.Script.Services.RestHandler.ExecuteWebServiceCall(HttpContext context, WebServiceMethodData methodData)","ExceptionType":"System.InvalidOperationException"}

============================

源代码：

    var itemsPerPage = 30;

    var store = new Ext.data.Store({
        proxy: new Ext.ux.AspWebAjaxProxy({
            url: '/Controls/ObjectList/ObjectListService.asmx/GetObjectList',
            actionMethods: {
                create: 'POST',
                destroy: 'DELETE',
                read: 'POST',
                update: 'POST'
            },
            reader: {
                type: 'json',
                model: 'Object',
                totalProperty: 'd.recordCount',
                //idProperty: 'object_id',
                root: 'd.resultSet'
            },
            headers: {
                'Content-Type': 'application/json; charset=utf-8'
            }
        }),
        pageSize: itemsPerPage,
        noCache: false,
        //autoLoad: true
        autoLoad: {
            params: {
                //query: '',
                start: 0,
                limit: itemsPerPage
            }
        }
    });    

...

    Ext.define('ObjectGrid', {
        extend: 'Ext.grid.Panel',

        initComponent: function () {
            var me = this;

            Ext.applyIf(me, {
                store: store,
                forceFit: true,
                autoScroll: true,
                height: 750,
                loadMask: true,

                columns: [
                ],

... 

                bbar: Ext.create('Ext.PagingToolbar', {
                    store: store,
                    displayInfo: true,
                    pageSize: 30,
                    displayMsg: 'Displaying records {0} - {1} of {2}',
                    emptyMsg: 'No records to display'

//                    type: 'pagingmemory',

//                    listeners: {
//                        afterrender: {
//                            single: true,
//                            fn: function (thispaging) {
//                                thispaging.first.on('click', function () {
//                                    Ext.Msg.alert('first', 'first');
//                                });
//                                thispaging.prev.on('click', function () {
//                                    Ext.Msg.alert('prev', 'prev');
//                                });
//                                thispaging.next.on('click', function () {
//                                    Ext.Msg.alert('next', 'next');
//                                });
//                                thispaging.last.on('click', function () {
//                                    Ext.Msg.alert('last', 'last');
//                                });
//                            }
//                        }
//                    }


//                    listeners: {
//                        'click' : function(which) { 
//                            alert('you have clicked'); 
//                        } 
//                    } 

                })  // bbar

            });

            me.callParent(arguments);
        }
    });

更新#1：

在上面提到的堆栈跟踪中，这两个调用之间的参数正在丢失。

在此处输入图像描述

第 39082 行：

this.requests.5.options.params = "{}"
(5) being the current object

在此处输入图像描述

第 47668 行：

operation.start = 2
operation.limit = 30

在此处输入图像描述

更新#2：

Ext.define('Ext.ux.AspWebAjaxProxy', {
    extend: 'Ext.data.proxy.Ajax',
    require: 'Ext.data',
    //processData: false,

    buildRequest: function (operation) {
        var params = Ext.applyIf(operation.params || {}, this.extraParams || {}),
                                request;
        params = Ext.applyIf(params, this.getParams(params, operation));
        if (operation.id && !params.id) {
            params.id = operation.id;
        }

        params = Ext.JSON.encode(params);

        request = Ext.create('Ext.data.Request', {
            params: params,
            action: operation.action,
            records: operation.records,
            operation: operation,
            url: operation.url
        });
        request.url = this.buildUrl(request);
        operation.request = request;
        return request;
    }
});
4

2 回答 2

1

我尝试回到 ExtJS 版本 4.0.0，但我的应用程序中的其他功能正在破坏。所以我坚持使用 4.1.0 版本并为此代理实施了一个 hack，所以它会起作用，所以我可以有一些想法（或者它是“安心？”）。

Ext.define('Ext.ux.AspWebAjaxProxy', {
    extend: 'Ext.data.proxy.Ajax',
    require: 'Ext.data',

    buildRequest: function (operation) {
        var params = Ext.applyIf(operation.params || {}, this.extraParams || {}),
                                request;
        params = Ext.applyIf(params, this.getParams(params, operation));

        if (params.page == null) {
            params.page = operation.page;
            params.start = operation.start;
            params.limit = operation.limit;
        }

        if (operation.id && !params.id) {
            params.id = operation.id;
        }

        params = Ext.JSON.encode(params);

        request = Ext.create('Ext.data.Request', {
            params: params,
            action: operation.action,
            records: operation.records,
            operation: operation,
            url: operation.url
        });
        request.url = this.buildUrl(request);
        operation.request = request;
        return request;
    }
});


//});
于 2012-09-26T00:47:46.287 回答
1

好吧，我想诀窍在于

// Clone params right now so that they can be mutated at any point further down the call stack
var me = this,
    params = operation.params = Ext.apply({}, operation.params, me.extraParams),
    request;

我认为您可以使用它来替换您的第一行，我想它应该可以工作。

还请看

// Set up the entity id parameter according to the configured name.
// This defaults to "id". But TreeStore has a "nodeParam" configuration which
// specifies the id parameter name of the node being loaded.
if (operation.id !== undefined && params[me.idParam] === undefined) {
    params[me.idParam] = operation.id;
}

不知道您是否也需要更新此内容。

于 2012-09-26T08:56:32.327 回答