Question

我尝试添加DT网站上的alpha搜索功能。这是代码：

var _alphabetSearch = '';
var alphabet;
$.fn.dataTable.ext.search.push(function(settings, searchData) {
    if (!_alphabetSearch) {
        return true;
    }
    if (searchData[0].charAt(0) === _alphabetSearch) {
        return true;
    }
    return false;
});

然后在document.ready函数中：

alphabet = $('<div class="alphabet"/>').append('Search Alpha: ');
$('<span class="clear active"/>')
    .data('letter', '')
    .html('None')
    .appendTo(alphabet);
for (var i = 0; i < 26; i++) {
    var letter = String.fromCharCode(65 + i);
    $('<span/>')
        .data('letter', letter)
        .html(letter)
        .appendTo(alphabet);
}

然后初始化表格：

$("#tblAllUsers").dataTable({
    bProcessing: true,
    sAjaxSource: '@Url.Action("GetAllUsers")',
    bJQueryUI: true,
    sProcessing: "<img src='~/Images/spinner.gif' />",
    dom: 'Tlf<"clear">rtip',
    bAutoWidth: false,
    "oLanguage": {
        sEmptyTable: "There are no Users at this time"
    },
    "aoColumns": [{
        "sWidth": "1%",
        sClass: "smallFonts"
    }, {
        "sWidth": "15%",
        sClass: "smallFonts"
    }, {
        "sWidth": "15%",
        sClass: "smallFonts"
    }, {
        "sWidth": "15%",
        sClass: "smallfonts"
    }],
    tableTools: {
        "sSwfPath": "../../Scripts/swf/copy_csv_xls_pdf.swf",
        "aButtons": [{
            "sExtends": "print",
            "bShowAll": true
        }]

    }
});

var table = $("#tblAllUsers").DataTable();
alphabet.insertBefore(table.table().container());
alphabet.on('click', 'span', function() {
    var tst = alphabet.find('.active');
    alphabet.find('.active').removeClass('active');
    var t = $(this);
    $(this).addClass('active');
    _alphabetSearch = $(this).data('letter');
    table.draw();
});

alpha行很好地显示但它从未找到任何东西。无论我点击哪个字母都没有返回。我做错了什么？

Answer 1

我忘记了表格中的第一列是记录的ID，所以我隐藏了该列，这修复了字母搜索：

if (searchData[1].charAt(0) === _alphabetSearch) {
    return true;
}

jQuery DataTables字母搜索不起作用

1 个答案: