首页 > 解决方案 > 查找执行搜索时数据表中返回的行数

问题描述

dataTable运行良好,但最后一件事我似乎无法做对,我要做的是隐藏bottom如果返回的搜索结果小于我pageLength的,因为它毫无意义

当前代码

 $('#dialPlanListTable').dataTable({
    "ordering": true,               // Allows ordering
    "searching": true,              // Searchbox
    "paging": true,                 // Pagination
    "info": false,                  // Shows 'Showing X of X' information
    "pagingType": 'simple_numbers', // Shows Previous, page numbers & next buttons only
    "pageLength": 10,               // Defaults number of rows to display in table. If changing this value change the show/hide below
    "columnDefs": [
        {
            "targets": 'dialPlanButtons',
            "searchable": false,    // Stops search in the fields 
            "sorting": false,       // Stops sorting
            "orderable": false      // Stops ordering
        }
    ],
    "dom": '<"top"f>rt<"bottom"lp><"clear">', // Positions table elements
    "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]], // Sets up the amount of records to display
    "language": {
        "search": "_INPUT_",            // Removes the 'Search' field label
        "searchPlaceholder": "Search dial plans"   // Placeholder for the search box
    },
    "fnDrawCallback": function () {
        // Sets up styles for dataTable
        $("input[type='search']").attr("id", "searchBox");
        $('#dialPlanListTable').css('cssText', "margin-top: 0px !important;");
        $("select[name='dialPlanListTable_length'], #searchBox").removeClass("input-sm");
        $('#searchBox').css("width", "300px").attr("autocomplete", 'off').focus();
        $('#dialPlanListTable_filter').removeClass('dataTables_filter');


        // var filteredData = $('#dialPlanListTable').dataTable()
        // .filter( function ( value, index ) {
        //    alert('value' + value)
        //    alert('index' + index)
        //    return value > 20 ? true : false;
        // } );

        // var info = $('#dialPlanListTable').DataTable().page.info();
        // var filt = $('tr', {"filter":"applied"}).length;

        // alert(info);
        // alert('filt: ' + filt);

        //var info = $('#dialPlanListTable').page.info();

        // $('#tableInfo').html(
        //     'Currently showing page '+($('#dialPlanListTable').page+1)+' of '+$('#dialPlanListTable').pages+' pages.'
        // );
        //alert('info: ' + info)
        //alert('Currently showing page '+($('#dialPlanListTable').page+1)+' of '+$('#dialPlanListTable').pages+' pages.')


        if ($('#dialPlanListTable').DataTable().rows().count() < 11) {
            $("div[class='bottom']").hide(); // Hides paginator & dropdown if less than 11 records returned
        } else {
            $("div[class='bottom']").show(); // Shows paginator & dropdown if 11 or more records are returned
        }
    }
});

// Show/Hide dataTable paginator and dropdown if 'No records found' displayed
$('#searchBox').keyup(function () {
    if ($("td[class='dataTables_empty']").is(":visible")) {
        $("div[class='bottom']").hide();
    } else {
        $("div[class='bottom']").show();
    }

    // var abc = $('#dialPlanListTable').search( this.value ).draw();
    // alert(abc)
    //alert('Currently showing page '+($('#dialPlanListTable').page+1)+' of '+$('#dialPlanListTable').pages+' pages.')
    // alert('count: ' + $('#dialPlanListTable').DataTable().rows().count())
    // alert('2: ' + dataTable.$('tr', {"filter":"applied"}).length)

    //var table = $('#example').DataTable();
    //var table = $('#dialPlanListTable').DataTable();


    // return info.recordsDisplay;
});

$('#searchBox').keyup(function ()我的AND中所有注释掉的代码都是我"fnDrawCallback": function ()尝试过但失败的。

搜索和返回结果的图像 在此处输入图像描述

标签: jquerydatatabledatatables

解决方案


设法通过以下代码解决它

$('#search_Box_ID').keyup(function () {
    var TableResults = DATATABLE_VAR_NAME.$('tr', {"filter":"applied"}).length;
    alert('TableResults : ' + TableResults );
});

推荐阅读