asp.net通过反射技术实现Ajax(2)--前台javascript封装的Ajax对象

有了AjaxUtil这个工具类我们可以在任何时候调用控件中的任意方法

返回我们想要的响应信息

当然,Ajax请求依赖的是javascript封装好的Ajax类

如果阅读本文的朋友希望通过微软的Ajax.net框架调用AjaxUtil 那么我只能说对不起了,这篇文章对你可能没有什么帮助,因为本人偏爱javascript,讨厌Ajax.net框架

下面看看封装好的Ajax

/*

    使用方式

    var ajax = new Ajax.Init(参数列表);

        ajax.sendRequest(运行时参数);



*/



var Ajax=new Object();

Ajax.READY_STATE_UNINITIALIZED=0;

Ajax.READY_STATE_LOADING=1;

Ajax.READY_STATE_LOADED=2;

Ajax.READY_STATE_INTERACTIVE=3;

Ajax.READY_STATE_COMPLETE=4;





/*

    Init初始化函数

    

    [参数列表]

    component:发出请求的DHTML组建,该组建需要实现ajaxUpdate方法和handleError方法

    url:请求url,可以带参数

    method:Get|Post

    requestParams:"恒量"参数数组 (格式:key=value)

    charset:文档编码形式

*/

Ajax.Init=function(component,url,method,requestParams,charset,contentType)

{    

    this.component = component;

    this.url=url;       //url to request

    this.method=(method)?method:"POST";  //默认一律采用post方式传递数据

    this.requestParams=(requestParams && (requestParams instanceof Array))?requestParams:null;

    this.charset=(charset)?"utf-8":charset;

    this.contentType=(contentType)?contentType:"application/x-www-form-urlencoded";

}



Ajax.Init.msgId=1;



Ajax.Init.prototype=

{

    //得到用于本次请求的XMLHttpRequest对象

    getTransport:function(){

        var transport;

        if(window.XMLHttpRequest)

            transport = new XMLHttpRequest();

        else if(window.ActiveXObject)

        {

            try{

                transport = new ActiveXObject("Msxml2.XMLHTTP");

            }

            catch(err){

                transport = new ActiveXObject("Microsoft.XMLHTTP");

            }

        }

        return transport;

    },

    //发送请求异步请求

    sendRequest:function()

    {

        var requestParams=[];

        for(var i=0;i<arguments.length;i++){

            requestParams.push(arguments[i]);

        }

        var request=this.getTransport();

        request.open(this.method,this.url,true);

        if(this.charset){

            request.setRequestHeader("CharSet",this.charset.toString());

        }

        request.setRequestHeader('Content-Type',this.contentType);

        

        var oThis=this;

        request.onreadystatechange=function(){

            oThis.handleAjaxResponse(request);

        }

        request.send(this.queryString(requestParams));

    },

    //得到请求参数的字符串形式

    queryString:function(args){

        var requestParams=[];

        for(var i=0;i<this.requestParams.length;i++){

            requestParams.push(this.requestParams[i]);  //为请求添加"恒量"参数

        }

        

        for(var j=0;j<args.length;j++){

            requestParams.push(args[j]);    //为请求添加运行时参数

        }

        

        var queryString='';

        if(requestParams && requestParams.length>0){

            for(var i=0;i<requestParams.length;i++){

                queryString += requestParams[i] + '&';

            }

            queryString = queryString.substring(0,queryString.length-1);//去掉最后一个&

        }

        return queryString;

    },

    //响应处理函数

    handleAjaxResponse:function(request){

        var ready = request.readyState;

        if(ready == Ajax.READY_STATE_COMPLETE)

        {

            if(this.isSuccess(request)){

                this.component.ajaxUpdate(request); //如果异步请求成功执行:调用组件的ajaxUpdate方法,执行组建更新

            }else{

                if(this.component.handleError){

                    this.component.handleError(request);    //如果组件实现了handleError函数:调用组件的handleError方法,执行错误通知

                }else{

                    this.defaultError.call(this,request);   //如果没有实现handleError函数:调用默认错误处理函数

                }

            }

        }

    },

    //判断请求是否成功

    isSuccess: function(request){

        return request.status == 0 || (request.status >=200 && request.status<300);

    },

    //默认错误通知

    defaultError:function(request)

    {

        var msgTxt ="error:fetching data!<ul><li>readyState:"+request.readyState

              +"<li>status:"+request.status

              +"<li>headers:"+request.getAllResponseHeaders()

              +"</ul>";

        alert(msgTxt);

    }

}

Ajax.getFormQueryString=function(frmID,itemName){

    var i,queryString = "", and = "";

    var item; // for each form's object

    var itemValue;// store each form object's value

    var form=document.getElementById(frmID)

    if(form!=null){

        var items;

        if(itemName){

            items=form[itemName];

        }else{

            items=form;

        }



        if(items){

            if(items.length){//是下拉列表或checkbox

                for( i=0;i<items.length;i++ ) {

                    item = items[i];// get form's each object

                    if ( item.name!=null && item.name!='' && (item.name!='__VIEWSTATE' && item.name.toUpperCase()!='__EVENTVALIDATION') ){

                        if ( item.type == 'select-one' ) {

                            itemValue = item.options[item.selectedIndex].value;

                        }else if ( item.type=='checkbox' || item.type=='radio') {

                            if ( !item.checked  ){

                                continue;    

                            }

                            itemValue = item.value;

                        }

                    }

                    itemValue = encodeURIComponent(itemValue);

                    queryString += and + item.name + '=' + itemValue;

                    and="&";

                }

            }

            else{

                item=items;

                if (!( item.type == 'button' || item.type == 'submit' || item.type == 'reset' || item.type == 'image')){// ignore this type

                    itemValue = item.value;

                }

                itemValue = encodeURIComponent(itemValue);

                queryString += and + item.name + '=' + itemValue;

                and="&";

            }

        }

    }

    return queryString;

}

未完待续