datatable 用法(1)
这两天基于struts2的web项目需要报表排序功能，上网找了一些jquery的插件，找到了一个datatable。搞了两天，弄出个样子。但是导出功能不满足客户需求。所以暂时将该功能搁置了。自己在其中学了不少东西，现在整理整理。
开始，我的想法是通过ajax与数据库进行交换，进行排序。页面的代码。如下：
function sortData(){if (oTable == null) {$("#exportTable").show(); oTable = $('#exportTable').dataTable( {"aaSorting": [[4, 'desc']], "bProcessing": true, //加载数据时显示正在加载信息 "bServerSide": true, //指定从服务器端获取数据 "sAjaxSource": "" , //获取数据的ajax方法的URL "fnServerData":retrieveData //与后台交互获取数据的处理函数 } ); }oTable.fnDraw(); }//函数的参数是固定，不能更改。function retrieveData( sSource, aoData, fnCallback ) { //查询条件称加入参数数组 var year =document.getElementById('year').value; var month =document.getElementById('month').value; $.ajax( { type: "POST", //contentType: "application/json", //这段代码不要加，我时延的是否后台会接受不到数据 url: sSource, dataType:"json", data:"jsonparam="+JSON.stringify(aoData)+"&year="+year+"&month="+month, //以json格式传递(struts2后台还是以string类型接受),year和month直接作为参数传递。 success: function(data) { $("#url_sortdata").val(data.aaData); fnCallback(data); //服务器端返回的对象的returnObject部分是要求的格式 } }); } <table id="exportTable" width="100%" align='center'><thead><tr><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th></tr></thead><tbody align='center' style="line-height: 18px;border: 1px solid #97bbdc;" ></tbody><tfoot><tr><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th><th width ='10%' align='center' ></th></tr></tfoot></table>
public String sortMonthData() {HttpServletRequest request = ServletActionContext.getRequest();HttpServletResponse response = ServletActionContext.getResponse();JSONArray jsonobj = JSONArray.fromObject(jsonparam);Object sEcho = (JSONObject.fromObject(jsonobj.get(0)).get("value"));//这里我只是测验将sEcho取出ptp_list = 查询数据库获取的数据 //将查询内容数据,封装成JSONArray的数据对象.(这里还可以使用二维数组，反正需要注意页面接受到的数据格式是[[1,2,3,5],[1,2,3,5]])JSONArray jsonDataArray = new JSONArray() ;Collection map = null;for (int i = 0; i < ptp_list.size(); i++) {map = ptp_list.get(i).values();jsonDataArray.add(map);}//JSON对象，封装datatable使用到页面参数，[color=red]这几个参数是必须要[/color]的。JSONObject returnjobj = new JSONObject();returnjobj.put("sEcho", sEcho);returnjobj.put("iTotalRecords", "1000");returnjobj.put("iTotalDisplayRecords", "1000");returnjobj.put("aaData",jsonDataArray);//输出ajax返回值。try {response.getWriter().print(returnjobj.toString());response.flushBuffer();}catch (IOException e) {// TODO Auto-generated catch blocke.printStackTrace();} finally {try {response.getWriter().close();} catch (IOException e) {// TODO Auto-generated catch blocke.printStackTrace();}}return null;}