码迷,mamicode.com
首页 > Web开发 > 详细

jquery.dataTable和jquery.DataTable初始化

时间:2020-05-07 23:15:38      阅读:119      评论:0      收藏:0      [点我收藏+]

标签:tail   orm   load   false   etl   code   draw   name   初始   

两者均能对dataTable进行初始化,DataTable() 没有.fnDraw(false)函数,dataTable()没有.row(tr)函数。

function fnClickReload() {
    if (typeof (tblList) != "undefined") {
        tblList.fnDraw(false);
        editRow();
    }
}

 

如果dataTable()要使用.row(tr)函数,使用.api()

var tr = $(this).closest(‘tr‘);
var row = tblList.api().row(tr);

 

例如:

var tblList;
function getList() {

    if (typeof (tblList) != "undefined") {
        tblList.fnClearTable(false);
        tblList.fnDestroy();
    }

    tblList = $("#tblList").dataTable({
columns: [
            {
                orderable: false,
                defaultContent: "",
                className: ‘details-control‘,
                data: ‘MessageId‘
            }],
        fnCreatedRow: function (nRow, aData, iDataIndex) {
            $(‘td:eq(0)‘, nRow).html("<b>+</b>");
        }
    });

    editRow();
}

function editRow() {
    $(‘#tblList tbody‘).on(‘click‘, ‘td.details-control‘, function () {
        var tr = $(this).closest(‘tr‘);
        var row = tblList.api().row(tr);

        if (row.child.isShown()) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass(‘shown‘);
            tr.children("td").eq(0).html("<b>+</b>");
        }
        else {
            // Open this row
            row.child(format(row.data())).show();
            tr.addClass(‘shown‘);
            tr.children("td").eq(0).html("<b>-</b>");
        }
    });
}

function format(row) {
    return "<div style=\"padding-left:50px;\"><b>标题:</b>" + row.Subject +" <b>内容:</b>"+ row.Body+"</div>";
}
<table class="table table-striped table-bordered table-hover " id="tblList">
                        <thead>
                            <tr>
                                <th></th>
                                <th>发送机构</th>
                                <th>提醒类别</th>
                                <th>提醒时间</th>
                                <th>提醒范围</th>
                                <th>提醒机构</th>
                                @*<th>提醒标题</th>
                                <th>提醒内容</th>*@
                                <th>状态</th>
                                <th>创建者</th>
                            </tr>
                        </thead>
                        <tfoot>
                            <tr>
                                <th></th>
                                <th>发送机构</th>
                                <th>提醒类别</th>
                                <th>提醒时间</th>
                                <th>提醒范围</th>
                                <th>提醒机构</th>
                                @*<th>提醒标题</th>
                                <th>提醒内容</th>*@
                                <th>状态</th>
                                <th>创建者</th>
                            </tr>
                        </tfoot>
                    </table>

 

jquery.dataTable和jquery.DataTable初始化

标签:tail   orm   load   false   etl   code   draw   name   初始   

原文地址:https://www.cnblogs.com/hofmann/p/12846163.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!