Afficher les lignes en fonction des valeurs dans plusieurs colonnes. JQuery

Question

Dans JQuery, il est facile de masquer une ligne de table en fonction d'une colonne prédéfinie. La valeur td est facile à l'aide du code suivant. Cependant, comment pourrais-je faire pour montrer les lignes qui correspondent aux valeurs td dans plus d'une colonne?

Quelque chose comme ce qui suit (ce qui ne fonctionne pas)

function filterRows(word){ 
$('.application>tbody>tr') 
.show() 
.find('td:nth-child(2)').not(':contains("'+word+'")') 
.find('td:nth-child(3)').not(':contains(30)') 
.parent() 
.hide() 
} 

Fondamentalement, je veux être en mesure de montrer que les lignes où mon mot est passé dans « mot » est dans la deuxième colonne td et la troisième colonne contient "30".

Merci pour tout heads up.

Answer 1

Vous pouvez utiliser .end() de sauter en arrière dans la chaîne, comme ceci:

function filterRows(word){ 
    $('.application>tbody>tr').show() 
    .find('td:nth-child(2)').not(':contains("'+word+'")').parent().hide() 
    .end().end().end() //back 3 spots for parent, not and find 
    .find('td:nth-child(3)').not(':contains(30)').parent().hide(); 
} 

Bien que, dans ce Enchaînement de cas est un peu bavard, il faut garder une référence dans une variable, comme ceci:

function filterRows(word){ 
    var rows = $('.application>tbody>tr').show(); 
    rows.find('td:nth-child(2):not(:contains("'+word+'"))').parent().hide(); 
    rows.find('td:nth-child(3):not(:contains(30))').parent().hide(); 
} 

Ou un peu plus complexe sélecteur:

function filterRows(word){ 
    $('.application>tbody>tr').show() 
    .find('td:nth-child(2):not(:contains("'+word+'")), td:nth-child(3):not(:contains(30))').parent().hide(); 
} 

Answer 2

Que diriez-vous de mettre .parent() après la première découverte.

.find('td:nth-child(2)').not(':contains("'+word+'")').parent() 

Answer 3

function filterrows(word) { 
    var row = $(".application>tbody>tr"); 
    row.each(function() { 
    $this = $(this); 
    var secondColumn = $('td:nth-child(2):not(contains("'+word+'"))', $this) 
    var thirdColumn= $('td:nth-child(2):not(:contains("30")', $this) 
    if (secondColumn.length && thridcolumn.length) { //if you find both a second and third column that matches 
     $this.hide(); 
    } else { //if the second and third column dont match 
     $this.show(); 
    } 
    }); 
} 

Answer 4

est ici d'une manière plus efficace de le faire:

function filterRows(word){ 
    $('.application>tbody>tr').show() 
     .filter(function() { 
      return this.cells[ 1 ].innerHTML.indexOf(word) < 0 || 
        this.cells[ 2 ].innerHTML.indexOf("30") < 0; 
     }).hide() 
} 

S'il y a des balises imbriquées, une approche légèrement différente doit être prise dans le filtre. Dans ce cas, vous devez remplacer this.cells[ 1 ].innerHTML avec:

(this.cells[ 1 ].innerText || this.cells[ 1 ].textContent) 

(Même chose pour cells[ 2 ] bien sûr.)

---

EDIT: Je eu && au lieu de ||. On dirait que l'exigence est de .show() si les deux correspondances sont trouvées. Fixé. Maintenant, il se cachera si l'une ou l'autre correspondance n'est pas trouvée.