ExtJS Ajax全面解析：Ext.Ajax.request与DWR集成

"ExtJS全攻略，讲解ExtJS对Ajax的支持，包括Ext.Ajax类的使用和与DWR的整合，适合希望深入理解ExtJS的开发者。" 在ExtJS框架中，Ajax支持是至关重要的，因为它使得与服务器进行异步通信变得容易而高效。本资源主要涵盖了两个核心知识点：Ext.Ajax类的使用以及在ExtJS中整合Direct Web Remoting (DWR)的方法。 1. Ext.Ajax入门 Ext.Ajax是一个全局对象，它提供了一种简洁且灵活的方式来处理Ajax请求。它抽象了底层的XMLHttpRequest对象的复杂性，使开发者能够专注于处理业务逻辑而不是底层实现。`Ext.Ajax.request`是其主要方法，用于发送Ajax请求到服务器。 1.1 Ext.Ajax.request方法详解 这个方法是发送Ajax请求的核心，它接受一个配置对象作为参数，该对象包含如URL、请求方法、数据、回调函数等信息。例如，以下代码演示了一个简单的登录功能，通过表单提交数据到服务器： ```javascript function login() { var requestConfig = { url: 'loginServer.jsp', form: 'loginForm', callback: function(options, success, response) { var msg = ["请求是否成功：", success, "\n", "服务器返回值：", response.responseText]; alert(msg.join('')); } }; Ext.Ajax.request(requestConfig); } ``` 在这个例子中，`url`指定了请求的服务器端脚本，`form`是提交的表单ID，`callback`定义了当请求完成时执行的回调函数，用于处理服务器的响应。 1.2 提交XML数据 如果需要提交XML格式的数据，可以在`requestConfig`中设置`params`属性，将XML字符串作为参数传递。同时，可能需要设置`contentType`为`'application/xml'`来告知服务器数据格式。 1.3 提交JSON数据 对于JSON数据，同样通过`params`属性传递JSON对象，并设置`contentType`为`'application/json'`。这使得服务器能够正确解析传入的数据。 2. 在ExtJS中直接使用DWR Direct Web Remoting (DWR)是一种JavaScript库，允许在浏览器和服务器之间直接调用Java方法。在ExtJS中，有几种方式来集成DWR： 2.1 Grid中使用DWR获取后台数据 可以使用DWR的`RemoteProxy`或`DWRTreeLoader`来加载Grid的数据。这些组件能够直接调用后台的Java方法，获取并显示数据。 2.2 DWRTreeLoader `DWRTreeLoader`允许在TreePanel中使用DWR从服务器获取和展示层次结构数据。 2.3 DWRProxy与ComboBox `DWRProxy`可与ComboBox结合使用，动态地从服务器获取数据填充下拉列表，实现动态搜索和过滤功能。 通过学习这些内容，开发者不仅可以熟练掌握Ext.Ajax的使用，还能理解如何在ExtJS应用中集成DWR，提升Web应用程序的交互性和性能。任务与总结部分则提供了实践练习，帮助巩固所学知识。