首页 > 其他分享> 文章详细

ExtJS 数据处理-Ext.Ajax

2022-07-23 08:31:52 阅读：212 来源： 互联网

标签：console log request Ajax response Ext options ExtJS

更新记录
2022年7月23日发布。
2022年7月16日从笔记迁移到博客。

ExtJS教程汇总：https://www.cnblogs.com/cqpanda/p/16328016.html

Ext.Ajax

说明

Ext.Ajax是一个单例对象，用于处理web请求
Ext.Ajax是Ext.data.Connection类型的单例实例
Ajax is asynchronous by default

实例

配置请求的url

Ext.Ajax.request({
    url:"/test.json"
});

配置请求为同步执行

Ext.Ajax.async = false

配置请求的HTTP方法

Ext.Ajax.request({
    url:"/test.xml",    //请求的URL
    method: 'GET',      //请求的方法
});

配置请求的超时时间

Ext.Ajax.request({
    url:"/test.xml",    //请求的URL
    timeout: 60000,     //请求的超时时间,默认30秒
});

配置额外的数据

Ext.Ajax.request({
    url:"/test.xml",    //请求的URL
    params:             //额外的数据
    {
        id: 1,
        name: 'panda666'
    }
});

配置HTTP头

Ext.Ajax.request({
    url:"/test.xml",    //请求的URL
    headers:            //设置请求头参数
    {
        'Content-Type': 'application/json'
    }
});

配置请求成功回调函数

Ext.Ajax.request({
    url:"/test.json",
    success: function(response, options){
        //response 表示响应
        //options 表示ajax请求的参数
        if(request.status === 200)
        {
            //输出获得的数据
            console.log(request.responseText);
        }
    }
});

配置失败成功回调函数

Ext.Ajax.request({
    url:"/test.json",
    success: function(response, options){
        //response 表示响应
        //options 表示ajax请求的参数
        if(response.status === 200)
        {
            //输出获得的数据
            console.log(response.responseText);
        }
    },
    failure: function(response, options){
        console.log(response.status); //状态码
        console.log(response.statusText); //状态文本描述
        console.log(response.responseText); //返回的数据
        console.log(options);
    }
});

配置不论什么情况都会执行的回调函数

callback参数说明：
options：parameter to the request call
success：Boolean value according to if the request was successful or not
response：XMLhttpRequest object that contains the information of the response

Ext.Ajax.request({
    url:"/test.json",
    success: function(response, options){
        //response 表示响应
        //options 表示ajax请求的参数
        if(response.status === 200)
        {
            //输出获得的数据
            console.log(response.responseText);
        }
    },
    failure: function(response, options){
        console.log(response.status); //状态码
        console.log(response.statusText); //状态文本描述
        console.log(response.responseText); //返回的数据
        console.log(options);
    },
    callback: function( options, success, response ){
        console.log('任何时候都会执行');
    }
});

处理接收的JSON数据

Ext.Ajax.request({
    url:"/test.json",
    success: function(request, options){
        //request 表示请求
        //options 表示ajax请求的参数
        if(request.status === 200)
        {
            //数据转为JSON格式（decode JSON string）
            var data = Ext.decode(request.responseText);
            console.log(data);
        }
    },
    failure: function(request, options){
        console.log(request.status); //状态码
        console.log(request.statusText); //状态文本描述
        console.log(request.responseText); //返回的数据
        console.log(options);
    }
});

处理接收的XML数据

Ext.Ajax.request({
    url:"/test.xml",
    success: function(request, options){
        //request 表示请求
        //options 表示ajax请求的参数
        if(request.status === 200)
        {
            //处理XML数据
            var data = (request.responseXML);
            var node = data.getElementsByTagName('msg')[0];
        }
    },
    failure: function(request, options){
        console.log(request.status); //状态码
        console.log(request.statusText); //状态文本描述
        console.log(request.responseText); //返回的数据
        console.log(options);
    }
});

标签：console,log,request,Ajax,response,Ext,options,ExtJS
来源： https://www.cnblogs.com/cqpanda/p/16483308.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9