Sichtbarkeit der Tabellenzeile umschalten

Question

Ich muss einen Filter für eine Tabelle mit vielen Optionen codieren.

Mein Ansatz atm:

Auf der for-Schleife, die die Zeilen abruft, drücken Sie die Informationen der Option auf ein Array:

<script> 
     if (arrayTypes == null){ 
     var arrayTypes = []; 
     arrayTypes.push("{{option}}"); 
     } 
     else{ 
     arrayTypes.push("{{option}}");  
     } 
</script> 

, wenn die Schleife beendet ist Ich habe ein Array den Typ passende und Indexposition jeder Option mit der Tabelle, also:

Tabellenzeile, Option | Array-Index

Zeile 1, A ........ | [0] = A

Zeile 2, B ........ | [1] = B

Zeile 3, A ........ | [2] = A

Zeile 4, A ........ | [3] = A

etc ...

nun wie folgt Ich versuche es einzurichten:

$("#type_filters").on('click',"button[name='hide-A']",function(){ 
    for(var i=0;i<=arrayTypes.length;i++){ 
     if(arrayTypes[i] == 'A'){ 
     $("#my-table tr.option")[i].toggle(); 
     } 
    } 
    }) 

aber ich bin immer einen Fehler im Protokoll, dass toggle()ist nicht eine Funktion.

Könnte jemand helfen?

Answer 1

$("#my-table tr.option")[i] ist kein jQuery-Objekt, daher ist toggle nicht verfügbar. Sie erhalten das spezifische HTML-Element. So schalten Sie zu verwenden haben, um ihn wieder in jQuery:

var row = $("#my-table tr.option")[i]; 
$(row).toggle(); 

Answer 2

$("#type_filters").on('click',"button[name='hide-A']",function(){ 
    $.each(arrayTypes,function(i,v) { 
     if(v == 'A'){ 
     var _thisRow = $("#my-table tr.option")[i]; 
     $(_thisRow).toggle(); 
     } 
    }); 
});