jquery datatable显示隐藏子表

原文地址：http://jsfiddle.net/jkahon/XQY63/

参考：https://www.datatables.net/examples/api/row_details.html

html:

   
       
           
           
           
           
       
   
   
       
           
           
           
           
       
       
           
           
           
           
       
       
           
           
           
           
       
   

	Values	Number	Other
+	value 1	111	xyz
+	value 2	222	xyz
+	value 3	333	xyz

js:

$(function () {
    var parentTable = $("#parentTable").DataTable({
        order: [1, "asc"],
        columnDefs: [{
            sortable: false,
            targets: [0]
        }]
    });


    $(".expander").css({
        cursor : "pointer"
    }).click(function () {
        var row = parentTable.row($(this).closest("tr"));
        
        if(row.child() == undefined){
            $(this).html("-");
            var $table = $("

InnerV1	InnerV2	InnerV3	InnerV4
foo	bar	biz	baz
baz	biz	bar	foo
bar	foo	baz	biz

");
            $table.attr("id", "childTable_" + row.index());
            var childTable = $table.DataTable({
                order: [0, "desc"],
                columnDefs: [{
                    sortable: false,
                    targets: [1, 2]
                }]
            });
            
            row.child(childTable.table().container());
            row.child.show();
        } else {
            $(this).html("+");
            row.child(false);
        }
    });


});