vue Tab en CSS avec des tables

Question

Je besoin d'une vue de l'onglet en CSS avec chaque onglet représentant une table dynamique. Le tableau complet est construit dynamiquement en boucle et seulement après que, si les languettes doivent masquer et afficher chacune de la table correspondant à chaque onglet. Aucune suggestion? Le contenu de l'onglet est dans élément de la liste et seulement dans la boucle. Le développement est dans Django / Python sur AppSpot.

Le code suivant ne fonctionne pas pour jquery aussi, est-il un problème quelque part?

<pre><code> <div id="tabs">
 <ul> 
{% for poolname in poolnamelist %}
 <li><a href="#mypool{{ forloop.counter }}">
<span>{{ poolname|escape }}</span></a></li>
 {% endfor %}
 </ul>
 {% for poolsequence in sequences %}
 <div id="mypool{{ forloop.counter }}">
 <table> 
{% for sequence in poolsequence %}
 <form action="/mypool" method="post">
 <tr><td>{{ sequence.seqdate }}</td>
 <td><input type="submit" value="ChangeDriver"/></td>
 </tr>
 </form>
 {% endfor %}
 </table>
 </div>
 {% endfor %}
 </div>
 </code></pre>

Answer 1

Consultez jQuery UI onglets ; cela va faire ce que vous cherchez. Il est impossible de le faire en utilisant le CSS pur.

Answer 2

Juste du haut de ma tête, consultez ce que certains des boîtes à outils Javascript ont à offrir. Des choses comme jQuery avec quelques plugins ou Dojo pourraient avoir quelque chose comme ça dans sa bibliothèque Dijit.