Discussion :

[vince29]

Bonjour,

Voilà, j'utilise actuellement un code qui fonctionne pour afficher et cacher une div selon un clic sur la div principal, avec le code ci-dessous :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
var show_info_detaille = 0;
        $('#show_form_historique_transaction').click( function() {
            if(!show_info_detaille) {
                show_info_detaille = 1;
                $('#form_historique_transaction').show();
                $('#text_historique_transaction').html('<i class="fa fa-minus-square"></i>Historique de la transaction');
            } else {
                show_info_detaille = 0;
                $('#form_historique_transaction').hide();
                $('#text_historique_transaction').html('<i class="fa fa-plus-square"></i>Historique de la transaction');
            }
        });

Le problème que je rencontre aujourd'hui, c'est que je veux pouvoir faire la même chose sur plusieurs éléments identiques sur la même page. Par exemple, j'affiche une liste de données, et pour chaque élément je souhaite permettre l'affichage du détail.

le code actuel fonctionne pour le premier élément de la page mais pas les suivants car les mêmes noms je suppose.

Auriez-vous une solution?
Merci

Vince

[vince29]

je l'ai résolu en javascript :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
function afficherMasquer(id){
    if (document.getElementById('form_historique_transaction_' + id).style.display == "none"){
      document.getElementById('form_historique_transaction_' + id).style.display = "block";
      document.getElementById('text_historique_transaction_' + id).innerHTML = '<i class="fa fa-minus-square"></i>Fermer le détail de la transaction';
  } else {
      document.getElementById('form_historique_transaction_' + id).style.display = "none";
      document.getElementById('text_historique_transaction_' + id).innerHTML = '<i class="fa fa-plus-square"></i>Voir le détail de la transaction';
  }
}