2016-04-08 15 views
0

Ich habe versucht, die Alpha-Suchfunktion wie auf der DT-Website gefunden. Dies ist der Code:jQuery DataTables Alphabet Suche funktioniert nicht

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; 
}); 

Dann in der document.ready Funktion:

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); 
} 

dann die Tabelle zu initialisieren:

$("#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(); 
}); 

Die Alpha-Reihe zeigt sich schön, aber es nie findet etwas. Egal welchen Buchstaben ich anklicke, nichts kommt zurück. Was mache ich falsch?

+1

legte es auf jsfiddle oder codepen würde für andere leichter wenn sie eine laufende Version sehen können –

Antwort

0

Ich hatte vergessen, dass die erste Spalte in der Tabelle die ID des Datensatzes ist so blende ich diese Spalte und dies kann die Alpha Suche fixed:

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