2012-09-20 16 views
9

Ich benutze die jQuery DataTables plugin, und ein kleines Problem mit der Filterfunktion darin. Wenn ich eine Tabellenzelle mit Inhalt wie <a href='foo6'>Blah</a> habe, und ich filtere nach "6", wird diese Zelle angezeigt, obwohl es in "Blah" keine "6" gibt. Was ich tun möchte, ist, dass das DataTables-Plug-in HTML beim Filtern ignoriert.Wie ignoriere ich HTML beim Filtern einer jQuery Datentabelle?

Ich habe versucht, die DataTables-Website zu durchsuchen und widersprüchliche, nicht hilfreiche Leads gefunden. Ein Beitrag vorgeschlagen, dass ich eine sType:'html' Option in der Definition meiner aaColumns benötigt, aber ich habe versucht, und es hat nicht geholfen ... und ein späterer Beitrag vorgeschlagen, dass die aktuelle Version von DataTables automatisch die HTML-sType erkennt. Ich fand auch den Code-Schnipsel:

// Make filtering ignore HTML (see http://datatables.net/plug-ins/filtering) 
$.fn.dataTableExt.ofnSearch['html'] = function (sData) { 
    var n = document.createElement('div'); 
    n.innerHTML = sData; 
    if (n.textContent) { 
     return n.textContent.replace(/\n/g," "); 
    } else { 
     return n.innerText.replace(/\n/g," "); 
    } 
}; 

die Dinge beheben sollte ... aber es kam nicht.

Also meine Frage ist: weiß jemand da draußen DataTables zu ignorieren Nicht-Text (dh HTML) Inhalt beim Filtern Zeilen?

Antwort

6

Es stellte sich heraus, dass ich eine benutzerdefinierte mRender Funktion auf meiner Spaltenüberschriften benötigt. Noch wichtiger (da ich dies zuerst versucht habe, ohne das Argument "type" zu überprüfen), müssen Sie das Argument type verwenden, das für diese Funktion bereitgestellt wird, damit es nur beim Filtern angewendet wird.

Mein sah Endergebnis etwas wie folgt aus:

aaHeaders: [{ 
    mRender: function(data, type, full) { 
     // If we're filtering, don't look at the HTML; only filter on the text 
     return type == 'filter' ? $(data).text() : data 
    } 
}], //... 
+0

Ich konnte diese Lösung nicht zum Laufen bringen. Hast du noch andere Änderungen vorgenommen? – MadChuckle

+0

Nicht, dass ich mich erinnere, sorry. – machineghost

+0

Arbeitete für mich. Danke! – Ross

1

Sie können dieses versuchen:

$.fn.dataTableExt.ofnSearch['html'] = function (sData) { 
    return $("<div/>").html(sData).text(); 
} 
+0

Danke für den Vorschlag, aber ich habe es versucht und es hat nicht funktioniert. Ich habe sogar eine Debugger-Zeile darin eingefügt, um zu überprüfen, ob es ausgeführt wird, aber es stellte sich heraus, dass der Code nicht einmal geschlagen wurde :-( – machineghost

0
// To override basic search functionality of datatable 
      $.fn.dataTable.ext.search.push(
        function(settings, data, dataIndex) { 
         var tableId = settings['sTableId']; 
         var searchTerm = settings.oPreviousSearch.sSearch; 
         if ('tableId' == tableId){ 
//I added tableId condition as I have multiple table on same page.. 
          if(data[0].indexOf(searchTerm) > -1 ||data[2].indexOf(searchTerm) > -1||data[3].indexOf(searchTerm) > -1||data[4].indexOf(searchTerm) > -1||data[5].indexOf(searchTerm) > -1 || data[6].indexOf(searchTerm) > -1){ 
           return true; 
          }else{ 
           return false; 
          } 
         } 
         return true; 
        } 
      ); 
+0

, um Ihren Code zu begleiten, könnten Sie auch eine schriftliche Beschreibung geben –

1

einfach Ihre datatable.js Upgrade .. Ich habe 1.9.4 verwendet und bekam das gleiche Problem nach dem 1.10.9 Upgrade das Problem behoben ..

Verwandte Themen