zoukankan      html  css  js  c++  java
  • DataTable.NET 使用server-side processing

    https://datatables.net/examples/server_side/simple.html

    當頁面上要顯示的數據在10萬筆以上時,可以使用server-side processing. 這樣在change entries, paging, sorting的時候,會通過事先定義好的ajax去backend重新取得數

    RadGridTable = $('#tbNKeywords')
        .on( 'processing.dt', function ( e, settings, processing ) {
            // paging or sorting .etc processing or not,
            // processing will be true if processing finished.
            $('#loading_overlay').css( 'display', processing ? 'block' : 'none' );
        })
        .on('xhr.dt', function ( e, settings, json, xhr ) {
            // Ajax call back, add some code here...
            if (json == null || json["success"] == false) {
                $('#loading_overlay').css( 'display', 'none' );
            }
        })
        .on( 'draw.dt', function () {
            // check all rows if select-all checked
            if($(".select-all").is(":checked")) {
                CheckedAll = 1;
                RadGridTable.rows().select();
            }
    
            // reset select checkbox by saved selected row ids
            RadGridTable.rows().every( function ( rowIdx, tableLoop, rowLoop ) {
                if (AllSelectedRowIds.includes(this.id()))
                    this.select();
                } );
        })
        .on( 'page.dt', function () {
            if (CheckedAll == 1)
                return;
    
            // save selected row id when paging
            var selectedRowIds = RadGridTable.rows( { selected: true } ).ids();
            for (i = 0; i < selectedRowIds.count(); i++)
            {
                if (!AllSelectedRowIds.includes(selectedRowIds[i]))
                    AllSelectedRowIds.push(selectedRowIds[i]);
            }
        })
        .on( 'click', 'tbody tr', function () {
            if (CheckedAll == 1)
                return false;
        })
        .DataTable({
            "columns": [
                { "data": null },
                { "data": "Created_Date" },
                { "data": "xxxxxxxx" },
                { "data": "xxxxxxxx" },
                { "data": "xxxxxxxx" },
                { "data": "xxxxxxx" },
                { "data": "xxxxxxx" }
            ],
            columnDefs: [{
                orderable: false,
                className: 'select-checkbox',
                targets:   0,
                data: null,
                defaultContent: ''
            }],
            select: {
                style:    'multi',
                selector: 'td:first-child'
            },
            order: [[ 1, 'desc' ]],
            "paging": true,
            "searching": false,
            colReorder: false,
            fixedHeader: true,
            "processing": true,
            "serverSide": true,
            rowId: 'KeywordId',
         "language": { 
                "infoFiltered": ""  // remove "(filtered from x total entries)" part from datatable footer information.
            },
            "dom": '<"top"flp<"clear">>rt<"bottom"ip<"clear">>', 
            "ajax": {
                "url": "/common/service/xxxxxxxxHandler.ashx",
                "type": "POST",
                "data": function (d) {
                    d.action = "xxxxxxxxx";
                    d.data = JSON.stringify(xxxxxxx);
                    d.Id = <%=Id%>;
                }
            }
        });

    define dataTable頁面上的一些文字部分

    https://datatables.net/reference/option/language

    例如: 不想要顯示 "(filtered from x total entries)" 在 footer的部分

    $(document).ready(function() {
        $('#example').DataTable( {
            "language": {                
                "infoFiltered": ""
            }
        } );
    } );
  • 相关阅读:
    PAIRING WORKFLOW MANAGER 1.0 WITH SHAREPOINT 2013
    Education resources from Microsoft
    upgrade to sql server 2012
    ULSViewer sharepoint 2013 log viewer
    Top 10 Most Valuable Microsoft SharePoint 2010 Books
    讨论 Setsockopt选项
    使用 Alchemy 技术编译 C 语言程序为 Flex 可调用的 SWC
    Nagle's algorithm
    Nagle算法 TCP_NODELAY和TCP_CORK
    Design issues Sending small data segments over TCP with Winsock
  • 原文地址:https://www.cnblogs.com/sipher/p/10984285.html
Copyright © 2011-2022 走看看