problème avec onClick

Eléphanteau du PHP | 14 Messages

20 janv. 2012, 16:47

Bonjour a tous
aujourd'hui j'ai découvert cette fonction qui pourrais m’être bien utile mais qui ne serais pas assez complète, je vous explique...
j'ai un tableau du style
Image utilisateur
Image
dans chaque case [bloqué en écriture avec "readonly="readonly""] on va relever des données (températures) a partir d'une base de donnée.
Ce que je devrais faire c'est que, lorsque je clique sur rat1 j'affiche un " / " pour indiquer que les températures ne seront pas prisent (derrière je vais devoir développer des requêtes au protocole ModBusTCP qui iront dire a l'API de la machine de prise de mesure qu'on ne prend pas certaines températures enfin ça sera plus tard!)
ou lorsque je clique sur tête ou les autres parties du corps on m'affiche " / " pour indiquer que les températures ne sont pas prisent.
Sur internet j'ai trouvé la fonction onClick qui permet de changer la valeur de mes zones de texte...
Sauf que cette fonction ne me permet pas lorsque je ré-appuie sur le bouton de me re-afficher la température que j'avais initialement...
Est-ce que quelqu'un aurais une solution à ce problème, ou m'aider a développer une solution ?

ViPHP
xTG
ViPHP | 7331 Messages

20 janv. 2012, 17:16

Il faut les stocker dans un array JS sinon en effet tu ne les récupéreras jamais. ^^
Tu peux former ton array avec une boucle PHP (de la même façon que tu dois former ton tableau HTML je suppose).

Et ainsi obtenir quelque chose du genre :
<script type="text/javascript">
var tabTete = [1,2,3,4,5,6,7]; // 7 valeurs pour tes 7 colonnes
var tabCorps = [1,2,3,4,5,6,7];
var tabQueu = [1,2,3,4,5,6,7];

// L'état de notre affichage
var etatTete = true;
var etatCorps = true;
var etatQueu = true;

/*
* Notre fonction pour afficher/enlever les valeurs
* @param (String) nom de la ligne
*/
function switchValeurs(ligne){
  if( ligne == "tete" ){
    etatTete = !etatTete; // on inverse l'état
    for(i=0; i<7; i++){
      if( etatTete == true ) // on doit afficher les valeurs
        document.getElementById('tete_' + i).value = tabTete[i];
      else // on affiche la barre
        document.getElementById('tete_' + i).value = '/';
    }
  } // ect pour les deux autres
}
</script>
<table>
<tr>
  <td><button onclick="switchValeur('tete');">tête</button></td>
  <td><input type="text" name="tete_0" id="tete_0" value="0" /></td>
  <td><input type="text" name="tete_1" id="tete_1" value="1" /></td>
  <td><input type="text" name="tete_2" id="tete_2" value="2" /></td>
ect....
Et on peut obtenir quelque chose du même genre pour les colonnes en réfléchissant bien. :)

Eléphanteau du PHP | 14 Messages

20 janv. 2012, 17:46

Merci pour votre réponse j'ai développé le reste de l'application, et le code est le suivant:

Code : Tout sélectionner

<script type="text/javascript"> var tabTete = [1,2,3,4,5,6,7]; // 7 valeurs pour tes 7 colonnes var tabCorps = [1,2,3,4,5,6,7]; var tabQueu = [1,2,3,4,5,6,7]; // L'état de notre affichage var etatTete = true; var etatCorps = true; var etatQueu = true; /* * Notre fonction pour afficher/enlever les valeurs * @param (String) nom de la ligne */ function switchValeurs(ligne) { if( ligne == "tete" ) { etatTete = !etatTete; // on inverse l'état for(i=0; i<7; i++) { if( etatTete == true ) // on doit afficher les valeurs document.getElementById('tete_' + i).value = tabTete[i]; else // on affiche la barre document.getElementById('tete_' + i).value = '/'; } } if( ligne == "corps" ) { etatCorps = !etatCorps; // on inverse l'état for(i=0; i<7; i++) { if( etatTete == true ) // on doit afficher les valeurs document.getElementById('corps_' + i).value = tabCorps[i]; else // on affiche la barre document.getElementById('corps_' + i).value = '/'; } } if( ligne == "queu" ) { etatQueu = !etatQueu; // on inverse l'état for(i=0; i<7; i++) { if( etatQueu == true ) // on doit afficher les valeurs document.getElementById('queu_' + i).value = etatQueu[i]; else // on affiche la barre document.getElementById('queu_' + i).value = '/'; } } } </script> <html> <table> <tr> <td><button onclick="switchValeur('tete');">tête</button></td> <td><input type="text" name="tete_1" id="tete_1" value="1" /></td> <td><input type="text" name="tete_2" id="tete_2" value="2" /></td> <td><input type="text" name="tete_3" id="tete_3" value="3" /></td> <td><input type="text" name="tete_4" id="tete_4" value="4" /></td> <td><input type="text" name="tete_5" id="tete_5" value="5" /></td> <td><input type="text" name="tete_6" id="tete_6" value="6" /></td> <td><input type="text" name="tete_7" id="tete_7" value="7" /></td> </tr> <tr> <td><button onclick="switchValeur('corps');">corps</button></td> <td><input type="text" name="corps_1" id="corps_1" value="1" /></td> <td><input type="text" name="corps_2" id="corps_2" value="2" /></td> <td><input type="text" name="corps_3" id="corps_3" value="3" /></td> <td><input type="text" name="corps_4" id="corps_4" value="4" /></td> <td><input type="text" name="corps_5" id="corps_5" value="5" /></td> <td><input type="text" name="corps_6" id="corps_6" value="6" /></td> <td><input type="text" name="corps_7" id="corps_7" value="7" /></td> </tr> <tr> <td><button onclick="switchValeur('queu');">queu</button></td> <td><input type="text" name="queu_1" id="queu_1" value="1" /></td> <td><input type="text" name="queu_2" id="queu_2" value="2" /></td> <td><input type="text" name="queu_3" id="queu_3" value="3" /></td> <td><input type="text" name="queu_4" id="queu_4" value="4" /></td> <td><input type="text" name="queu_5" id="queu_5" value="5" /></td> <td><input type="text" name="queu_6" id="queu_6" value="6" /></td> <td><input type="text" name="queu_7" id="queu_7" value="7" /></td> </tr> </table> </html> <?php ?>
j'essaye un peut de comprendre le code suivant:

Code : Tout sélectionner

if( ligne == "tete" ) { etatTete = !etatTete; // on inverse l'état for(i=0; i<7; i++) { if( etatTete == true ) // on doit afficher les valeurs document.getElementById('tete_' + i).value = tabTete[i]; else // on affiche la barre document.getElementById('tete_' + i).value = '/'; } }
mais il reste un peut confus pouvez m'expliquer un peut la chose :s

ViPHP
xTG
ViPHP | 7331 Messages

20 janv. 2012, 18:34

if( ligne == "tete" ) // la fonction a été appelée à partir du bouton de la ligne tête
   {
    etatTete = !etatTete; // on inverse l'état (false = '/', true = affichage valeur)
    for(i=0; i<7; i++) // on a 7 input numérotés de 0 à 6
   {
     if( etatTete == true ) // on doit afficher les valeurs
       document.getElementById('tete_' + i).value = tabTete[i]; // on récupère la valeur dans le tableau et on l'affiche dans l'input
     else // on affiche la barre
       document.getElementById('tete_' + i).value = '/'; // on modifie la valeur de l'input par une barre
    }
   }
Un peu de commentaires. :D

N.B : tu as fait une erreur de renommage dans la dernière partie de la fonction (queu), tu affectes la valeur de l'état en le traitant comme un tableau (alors que c'est tabQueu qui est attendu).

Eléphanteau du PHP | 14 Messages

21 janv. 2012, 13:37

ha oui merci c'est corrigé, et j'ai compris le code.
Mais j'ai testé et ça n'a pas fonctionné :s

ViPHP
xTG
ViPHP | 7331 Messages

22 janv. 2012, 10:35

Ah j'ai rien testé, juste codé ça sur le tas.
Quelles sont les erreurs JS ?

Eléphanteau du PHP | 14 Messages

26 janv. 2012, 10:28

désolé du retard je capte souvent le net :s

donc juste en écrivant ma variable j'appuie sur le bouton mais rien ne ce produit :s
pas d’erreurs a proprement parler..