WEB开发网
开发学院网页设计JavaScript EXT调用ASP.NET AJAX WebService 阅读

EXT调用ASP.NET AJAX WebService

 2010-09-14 13:43:03 来源:WEB开发网   
核心提示: 只要严格遵守这两条请求规则,就可以正确的访问asp.net ajax WebService,EXT调用ASP.NET AJAX WebService(2),新建一个Ext.data.EnhancedConnection类,从Ext.data.Connection继承下来,只要传入的参数o中

只要严格遵守这两条请求规则,就可以正确的访问asp.net ajax WebService。

新建一个Ext.data.EnhancedConnection类,从Ext.data.Connection继承下来,

Ext.data.EnhancedConnection = function(config){
    Ext.apply(this,config);
    Ext.data.EnhancedConnection.superclass.constructor.call(this);   
}

重写它的request方法如下:

Ext.extend(Ext.data.EnhancedConnection,Ext.data.Connection,{
    webServiceHeaders : {'Content-Type': 'application/json;utf-8'},
    request : function(o){
         if(this.fireEvent("beforerequest", this, o) !== false){           
            var p = o.params;
            var hs = o.headers;;
            var url = o.url || this.url;
            if(typeof url == 'function'){
                url = url.call(o.scope||window, o);
            }
            var method = o.method||this.method||(p ? "POST" : "GET");
             //是否为WebService
            if(!o.isWebService)
            {
                //如果不是WebService请求,不改变EXT的请求行为
                if(typeof p == "function"){
                    p = p.call(o.scope||window, o);
                }
                if(typeof p == "object"){
                    p = Ext.urlEncode(p);
                }
                if(this.extraParams){
                    var extras = Ext.urlEncode(this.extraParams);
                    p = p ? (p + '&' + extras) : extras;
                }

                if(o.form){
                    var form = Ext.getDom(o.form);
                    url = url || form.action;

                    var enctype = form.getAttribute("enctype");
                    if(o.isUpload || (enctype && enctype.toLowerCase() == 'multipart/form-data')){
                        return this.doFormUpload(o, p, url);
                    }
                    var f = Ext.lib.Ajax.serializeForm(form);
                    p = p ? (p + '&' + f) : f;
                }
              
                if(this.defaultHeaders){
                    hs = Ext.apply(hs || {}, this.defaultHeaders);
                    if(!o.headers){
                        o.headers = hs;
                    }
                }
                if(method == 'GET' && (this.disableCaching && o.disableCaching !== false) || o.disableCaching === true){
                    url += (url.indexOf('?') != -1 ? '&' : '?') + '_dc=' + (new Date().getTime());
                }    
                Ext.lib.Ajax.setDefaultPostHeader(true);
            }
            else
            {
                //如果有指定WebService方法名称
                if(o.methodName){
                    url = url + "/" + o.methodName;
                }
                if(typeof p == "object"){
                    //使用不同的请求方式,使用不同的传参方式。
                    if(method == 'GET')
                    {
                        p = Ext.urlEncode(p);
                    }
                    else
                    {
                        p = Ext.util.JSON.encode(p);
                    }
                }
               
                hs = Ext.apply(hs || {},this.webServiceHeaders);
                if(!o.headers){
                    o.headers = hs;
                }
                Ext.lib.Ajax.setDefaultPostHeader(false);
            }
            var cb = {
                success: this.handleResponse,
                failure: this.handleFailure,
                scope: this,
                argument: {options: o},
                timeout : this.timeout
            };           

            if((method == 'GET' && p) || o.xmlData || o.jsonData){
                    url += (url.indexOf('?') != -1 ? '&' : '?') + p;
                    p = '';
            }

            if(typeof o.autoAbort == 'boolean'){
                if(o.autoAbort){
                    this.abort();
                }
            }else if(this.autoAbort !== false){
                this.abort();
            }          
            this.transId = Ext.lib.Ajax.request(method, url, cb, p, o);
            return this.transId;
        }else{
            Ext.callback(o.callback, o.scope, [o, null, null]);
            return null;
        }               
    }
});

用这个新定义的类来替代原来的Ext.Ajax 对象,但是Ext.lib.Ajax.setDefaultPostHeader(false);是一定不能少的。否则在请求时都会在Content-Type加上“application/x-www-form-urlencoded”,这样就会导致不能正常请求WebService。

Ext.Ajax = new Ext.data.EnhancedConnection({
    autoAbort : false,
   
    serializeForm : function(form){
        return Ext.lib.Ajax.serializeForm(form);
    }
});

通过这样的扩展后,在使用Ext.Ajax.Requst(o)时,只要传入的参数o中,增加一个isWebService来标识它是请求WebService的就可以访问了。也可以像这样使用DataStore来请求WebService:

Ext.data.WebServiceStore = function(){
   Ext.data.WebServiceStore.superclass.constructor.call(this,{
        //url:'Services/WebService.asmx/GetUsers',
        proxy : new Ext.data.HttpProxy({url:'Services/WebService.asmx/GetUsers',isWebService : true}),
        // create reader that reads the Topic records
        reader: new  Ext.data.UserJsonReader()
    })
}
Ext.extend(Ext.data.WebServiceStore, Ext.data.Store);

Updated 2007/11/29 : Ext.lib.Ajax.setDefaultPostHeader(false);这段代码要根据请求类型来分别设置不同的值。

上一页  1 2 

Tags:EXT 调用 ASP

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接