小试牛刀，DataTable使用技巧

　　最近做RoR开发项目，原有的表格处理程序难以满足需求的多样性，故选取DataTable这一利器来缩短开发时间，提高程序质量。

　　我主要是用到了DataTable的几个功能： 排序列指定，页面布局调整，大规模数据异步查询，数据格式自定义及其排序等等。之前对Javascript和jQuery不是很熟悉，借此机会也熟悉下Javascript以及设计模式的一些内容。本文中，我们假定要处理的table 的class为example. 基于此我们一一讲述上面所述几个功能。

　　1） 指定可排序的列

　　　　DataTable的API很灵活， 他的aoColumnDefs参数可以让你指定多种功能，几乎满足你的全部要求。 对于该参数，你可以借助aTargets属性来指定你要处理的列。接受参数既可以是列的序号，也可以是class名。具体做法如下：

$('.example').dataTable({
    "aoColumnDefs": [
    {"bSortable": false, "aTargets": ['unsortable']}
]
});

　　2)  页面布局调整

　　　　　我们可以借助aoColumnDefs来指定列宽。

$('.example').dataTable({
    "aoColumnDefs": [
    {"sWidth":"4em", "aTargets": ['sort_arrow']},
]
});

　　3） 异步查询

　　当表格的数据量过大，系统难以一次性将其取出时， 需要借助异步查询来得到我们想要的结果，做到随用随取。 这就要求我们在服务端对数据处理成JSON格式，由前端统一显示。

$(document).ready(function() {
    $('#example').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "../server_side/scripts/server_processing.php"
    } );
} );

　　4) 数据格式自定义及排序

　　datatable默认支持对数字、日期、字符串、货币等排序。加入需要显示的数据不是这四种，需要我们自己自定义数据类型和排序方式。参考代码如下：

jQuery.fn.dataTableExt.oSort['quota-byte-asc'] = function(a, b) {
      var x = parseFloat(a.split(",")[1]);
      var y = parseFloat(b.split(",")[1]);
      return ((x < y) ? -1 : ((x > y) ?  1 : 0));
    }

 jQuery.fn.dataTableExt.oSort['quota-byte-desc'] = function(a,b) {
      var x = parseFloat(a.split(",")[1]);
      var y = parseFloat(b.split(",")[1]);
      return ((x < y) ? 1 : ((x > y) ?  -1 : 0));
    }
$('.ug_datatable').dataTable({
      "aoColumnDefs": [
      {"aTargets": ['normailize'],
       "mRender": function (data, display, row) {
        return data.split(",")[0];
        }},
      {"aTargets": ["normailize"],
       "sType": "quota-byte"}
      ],
      "bFilter": false,
      "sPaginationType": "full_numbers"
});

datatable的源码在摸索中。。。