有了 common.xhrPost() 请求数据变得如此简单

本文介绍了一种名为清滴服务的JS类实现方法，通过Ajax技术进行数据获取及处理。文章详细展示了如何通过POST方式请求数据，并在客户端处理返回的JSON格式数据，包括表格填充、分页展示等功能。

应用示例：

/*********************************************************************** * System : NLWP * Date : 2011/03/10 * Description : 清滴服务 * Author : Livon ************************************************************************/ //js 类：清滴服务 var washService = { // 获取 getList: function( pageNumber, orderId ){ // 准备参数 var postContent = new Array(); with( postContent ) { name = "washService"; pageNumber = pageNumber; // 页码 pageSize = "10"; // 每页记录数 formId = "myFillterFormId"; // 高级查询（过滤器）的设置表单。 orderId = orderId ; // 订单 tableBodyId = "dataRows"; url = "wash2Add.action"; action = "select"; note = ToUnicode( dojo.byId("note_input").value ) ; handlerFunction = "washService.getList_handler"; // 处理函数名称 } // 发送 common.xhrPost( postContent ); }, // 处理函数 getList_handler: function( response ){ //（1）清空表格，准备填充。 table.dataClear("Data_List_Container"); //（2）设置查询关键字 var keyWord = new RegExp('(' + response.searchKeyWord + ')', 'gi'); //（3）显示数据 var list = response.washList; for ( var i = 0; i < list.length; i++) { // 准备数据 var cells = new Array(); cells[0] = "<input type='checkbox' name='rowCheckBox' value='" + list[i].washId + "'>"; cells[1] = list[i].rowIndex; cells[6] = "<a href="javascript: showUpdateDialog(/"" + list[i].washId + "/");" mce_href="javascript: showUpdateDialog(/"" + list[i].washId + "/");">修改</a>"; // 插入一行 table.insertRow( "Data_List_Container", cells ); // 位于 js/table.js } //（4）分页信息 dojo.byId("pagination_Panel").innerHTML = response.paginationHtml; //显示分页操作板。 //（5）提示 dojo.publish("promptMessageTopic", [{message: "数据已更新。",type: "message", duration: 1000}]); }, ... ...

common.xhrPost() 函数：

var common = { xhrPost: function( postContent ){ // 发送 Ajax 请求。 dojo.xhrPost({ url: postContent.url , handleAs: "json", form: postContent.formId , // 当 form 与 cotnet 中同时存在相同变量时，以 content 为准。 content: postContent , load : function( response ) { // 判断是否成功执行（无记录 = 不成功） if( response.code == 0){ eval( postContent.handlerFunction + "(" + response + ");" ); } else{ alert( "ERROR: " + response.code + " - " + response.message ); } }, error : function(error) { alert( postContent.name + " : " + error); } }); return null; }, ... ...