Datatables中文API——回调函数

比眉伴天荒 2022-04-13 07:30 350阅读 0赞

**fnCookieCallback：还没有使用过**

$(document).ready(function () {
    
        $('#example').dataTable({
    
            "fnCookieCallback": function (sName, oData, sExpires, sPath) {
    
                // Customise oData or sName or whatever else here
    
                return sName + "=" + JSON.stringify(oData) + "; expires=" + sExpires + "; path=" + sPath;
    
            }
    
        });
    
    });

**fnCreatedRow：顾名思义，创建行得时候的回调函数**

$(document).ready(function () {
    
        $('#example').dataTable({
    
            "fnCreatedRow": function (nRow, aData, iDataIndex) {
    
                // 为a的话字体加粗
    
                if (aData[4] == "A") {
    
                    $('td:eq(4)', nRow).html('<b>A</b>');
    
                }
    
            }
    
        });
    
    });

**fnDrawCallback：draw画 ，这个应该是重绘的回调函数**

$(document).ready(function () {
    
        $('#example').dataTable({
    
            "fnDrawCallback": function (oSettings) {
    
                alert('DataTables 重绘了');
    
            }
    
        });
    
    });

**fnFooterCallback：底部的回调函数，这个可以用来做总计之类的功能**

$(document).ready(function() {
    
        $('#example').dataTable({
            "fnFooterCallback": function(nFoot, aData, iStart, iEnd, aiDisplay) {
    
                nFoot.getElementsByTagName('th')[0].innerHTML = "Starting index is " + iStart;
    
            }
        });
    
    });

**fnFormatNumber：顾名思义，格式化数字的显示方式**

$(document).ready(function () {
    
        $('#example').dataTable({
            "fnFormatNumber": function (iIn) {
                if (iIn < 1000) {
                    return iIn;
                } else {
                    var s = (iIn + ""),
                    a = s.split(""), out = "",
                    iLen = s.length;
                    for (var i = 0; i < iLen; i++) {
                        if (i % 3 === 0 && i !== 0) {
                            out = "'" + out;
                        }
                        out = a[iLen - i - 1] + out;
                    }
                }
                return out;
            }
        });
    });

**fnHeaderCallback：表头的回调函数**

$(document).ready(function () {
    
        $('#example').dataTable({
    
            "fnHeaderCallback": function (nHead, aData, iStart, iEnd, aiDisplay) {
    
                nHead.getElementsByTagName('th')[0].innerHTML = "Displaying " + (iEnd - iStart) + " records";
    
            }
    
        });
    
    })

**fnInfoCallback：datatables信息的回调函数**

$('#example').dataTable({
    
        "fnInfoCallback": function (oSettings, iStart, iEnd, iMax, iTotal, sPre) {
    
            return iStart + " to " + iEnd;
    
        }
    
    });

**fnInitComplete：datatables初始化完毕后会调用这个方法**

$(document).ready(function () {
    
        $('#example').dataTable({
            "fnInitComplete": function (oSettings, json) {
    
                alert('DataTables has finished its initialisation.');
    
            }
        });
    
    });

`fnPreDrawCallback：每一次绘datatables时候调用的方法`

$(document).ready(function () {
    
        $('#example').dataTable({
    
            "fnPreDrawCallback": function (oSettings) {
    
                if ($('#test').val() == 1) {
    
                    return false;
    
                }
    
            }
    
        });
    
    });

**fnRowCallback：行的回调函数**

$(document).ready(function () {
    
        $('#example').dataTable({
    
            "fnRowCallback": function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
    
                // Bold the grade for all 'A' grade browsers
    
                if (aData[4] == "A") {
    
                    $('td:eq(4)', nRow).html('<b>A</b>');
    
                }
    
            }
    
        });
    
    });

**fnServerData：这个是结合服务器模式的回调函数，用来处理服务器返回过来的数据**

// POST data to server
    
    $(document).ready(function () {
    
        $('#example').dataTable({
    
            "bProcessing": true,
    
            "bServerSide": true,
    
            "sAjaxSource": "xhr.php",
    
            "fnServerData": function (sSource, aoData, fnCallback, oSettings) {
    
                oSettings.jqXHR = $.ajax({
    
                    "dataType": 'json',
    
                    "type": "POST",
    
                    "url": sSource,
    
                    "data": aoData,
    
                    "success": fnCallback
    
                });
    
            }
    
        });
    
    });

**fnServerParams：向服务器传额外的参数**

$(document).ready(function () {
    
        $('#example').dataTable({
    
            "bProcessing": true,
    
            "bServerSide": true,
    
            "sAjaxSource": "scripts/server_processing.php",
    
            "fnServerParams": function (aoData) {
    
                aoData.push({ "name": "more_data", "value": "my_value" });
    
            }
    
        });
    
    });

**fnStateLoad：读取状态的回调函数**

$(document).ready(function () {
    
        $('#example').dataTable({
    
            "bStateSave": true,
    
            "fnStateLoad": function (oSettings) {
    
                var o;
    
    
                // Send an Ajax request to the server to get the data. Note that
    
                // this is a synchronous request.
    
                $.ajax({
    
                    "url": "/state_load",
    
                    "async": false,
    
                    "dataType": "json",
    
                    "success": function (json) {
    
                        o = json;
    
                    }
    
                });
    
    
                return o;
    
            }
    
        });
    
    });

**fnStateLoadParams：和上面的不知道什么区别，没用过**

// Remove a saved filter, so filtering is never loaded
    
    $(document).ready(function () {
    
        $('#example').dataTable({
    
            "bStateSave": true,
    
            "fnStateLoadParams": function (oSettings, oData) {
    
                oData.oSearch.sSearch = "";
    
            }
    
        });
    
    });
    
    
    
    // Disallow state loading by returning false
    
    $(document).ready(function () {
    
        $('#example').dataTable({
    
            "bStateSave": true,
    
            "fnStateLoadParams": function (oSettings, oData) {
    
                return false;
    
            }
    
        });
    
    });

**fnStateLoaded：又是这个，加了ed 不知道意思没用过**

// Show an alert with the filtering value that was saved
    
    $(document).ready(function () {
    
        $('#example').dataTable({
    
            "bStateSave": true,
    
            "fnStateLoaded": function (oSettings, oData) {
    
                alert('Saved filter was: ' + oData.oSearch.sSearch);
    
            }
    
        });
    
    });

**fnStateSave：状态储存**

$(document).ready( function() {
    
        $('#example').dataTable({
            "bStateSave": true,
    
            "fnStateSave": function(oSettings, oData) {
    
    // Send an Ajax request to the server with the state object
    
                $.ajax({
                    "url": "/state_save",
    
                    "data": oData,
    
                    "dataType": "json",
    
                    "method": "POST"
    
                    "success": function () {
                }
    
            });
        };
    
    } );
    
    } );

**fnStateSaveParams** ：状态储存参数，没用过，不明白

// Remove a saved filter, so filtering is never saved
    
    $(document).ready(function () {
    
        $('#example').dataTable({
    
            "bStateSave": true,
    
            "fnStateSaveParams": function (oSettings, oData) {
    
                oData.oSearch.sSearch = "";
    
            }
    
        });
    
    });

转自:[https://www.cnblogs.com/zhangwei595806165/p/3701463.html][https_www.cnblogs.com_zhangwei595806165_p_3701463.html]

[https_www.cnblogs.com_zhangwei595806165_p_3701463.html]: https://www.cnblogs.com/zhangwei595806165/p/3701463.html