Masquer/afficher les résultats en fonction du filtre

J'ai une application web MVC.net. Dans la vue, j'ai une liste d'enregistrements de ma base de données. Les enregistrements sont affichés dans le format suivantMasquer/afficher les résultats en fonction du filtre

if (List!=null) 
{ 
<table> 
    <thead> 
    <th></th> 
    </thead>  
    <tbody> 
    foreach (item in List) 
     if (item.startWith("AA")) 
     { 
     hide the item originally. and add class to be used by javascript/jquery to show/hide element 
     } 
    <td>Item</td> 
    </tbody> 
</table> 
}

Ce que je veux faire est de mettre un bouton au-dessus de la table « Afficher/Masquer » Cela va cacher/montrer certains des résultats quand on clique dessus. C'est le squelette simplifié de mon code. Ma table actuelle contient beaucoup plus d'informations à ce sujet.

Source

2017-10-19 laz

** certains des résultats **? Peux-tu être plus précis ? Nous avons besoin d'un modèle – Shyju

Je dois masquer les résultats qui commencent par un préfixe. "AA". Je vais changer le code un peu pour montrer – laz

Marquez les éléments devant être affichés/masqués, par ex. avec un marqueur CSS class. Vous pouvez également définir la propriété CSS display pour les masquer initialement. Ensuite, utilisez jquery pour afficher/masquer ces éléments en utilisant la classe de marqueur en tant que sélecteur.

<script type="text/javascript"> 
    $('#show').on('click', function() { 
     var affectedElements = $('[email protected]'); 
     affectedElements.show(); 
    }); 
</script>

Source

2017-10-19 13:29:50

merci Georg c'était utile. – laz

Vous pouvez faire le filtrage avec CSS pur si vous mettez le bouton avant la table et soit au même niveau ou plus élevé.

<html> 
<head> 
    <style> 
     #filter-toggle:checked ~ .filterable-table .filterable { display: none; } 
    </style> 
</head> 
    <body> 
     <input id="filter-toggle" type="checkbox"> 
     <label for="filter-toggle"> Filter</label> 
     <table class="filterable-table"> 
      <tr class="filterable"><td>Hide me when filtered</td></tr> 
      <tr><td>Show me when filtered</td></tr> 
     </table> 
    </body> 
</html>

Source

2017-10-19 13:50:03

merci Steve. J'ai résolu le problème en utilisant l'approche de Georg – laz

Masquer/afficher les résultats en fonction du filtre

Répondre

Questions connexes