Colorier une ligne d'un tableau si on coche une case à cocher [Résolu]

Dams91 4 Messages postés mardi 12 septembre 2006Date d'inscription 15 février 2009 Dernière intervention - 12 févr. 2009 à 15:56 - Dernière réponse : Dams91 4 Messages postés mardi 12 septembre 2006Date d'inscription 15 février 2009 Dernière intervention
- 15 févr. 2009 à 19:02
Bonjour à tous!

Je tiens tout d'abord à vous dire que je suis complètement noob en matière de javascript aussi j'aimerai faire un petit script mais je ne sais pas du tout comment...

Alors voilà ce que j'aimerai faire:

Imaginez un tableau avec plusieurs lignes et  3 ou 4 colonnes. Dans la dernière colonne il y aura une case à cocher qui, si elle est cochée, devra colorier (en rouge par exemple) la ligne qui contient cette case! Et bien entendu, si on la décoche, et bien ça redevient blanc!

Je suis débutant, donc est-ce que quelqu'un aurait la gentillesse de me faire une petite fonction qui réalise ce que je veux? Je ne sais pas du tout comment m'y prendre...

Cordialement

Damien
Afficher la suite 

Votre réponse

6 réponses

Meilleure réponse
Bul3 4934 Messages postés samedi 1 juillet 2006Date d'inscription 2 février 2015 Dernière intervention - 13 févr. 2009 à 09:36
3
Merci
tu te compliques la vie
et comment on peut deviner le contenu de tes $variables ?
mais, un ch'tiot exemple :

<script>
    function colorier(quoi)
    {    if ( quoi.checked )
                quoi.parentNode.parentNode.style.backgroundColor="#FF0000";
        else    quoi.parentNode.parentNode.style.backgroundColor="transparent";
    }
</script>
<table>
    ----
        
       , 1ere colonne</td>
        2e colonne,
        ,
   
    ----
        
        1ere colonne,
        2e colonne,
        ,
   

</td></tr></tbody></table>@+

Merci Bul3 3

Avec quelques mots c'est encore mieux Ajouter un commentaire

Codes Sources a aidé 93 internautes ce mois-ci

Commenter la réponse de Bul3
Bul3 4934 Messages postés samedi 1 juillet 2006Date d'inscription 2 février 2015 Dernière intervention - 12 févr. 2009 à 16:18
0
Merci
bonjour,
>>complètement noob en matière de javascript
c'est le moment d'apprendre
ce n'est vital ni pour ton application, ni pour ton job...
il faut en profiter

pour ton cas, il "suffit" de modifier le style de la ligne

fait au moins un petit quelque chose
on t'aidera à mettre au point
Cordialement

[mon Site][M'écrire]Bul
Commenter la réponse de Bul3
Dams91 4 Messages postés mardi 12 septembre 2006Date d'inscription 15 février 2009 Dernière intervention - 12 févr. 2009 à 16:46
0
Merci
Alors, j'ai fais ça vite fait avec ce que j'ai regardé sur le site du zéro:

pour le code du tableau, je met juste une ligne:

<tr id="$variable_qui_change_dans_une_boucle_for">
            <form method="post" action="mon_fichier.php">
            <td>1ere colonne</td>
            <td>2e colonne</td>
            <td></td>
            </form>
        </tr>

Et la fonction javascript:

<script type="text/javascript">
function colorier(a) {

    document.getElementsById('a').style.backgroundColor = 'red';
   
}
</script>

Par contre ça ne marche pas et je ne vois pas comment tester dans la fonction si c'est un "cochage" de la case ou un "décochage"...

Damien
Commenter la réponse de Dams91
Dams91 4 Messages postés mardi 12 septembre 2006Date d'inscription 15 février 2009 Dernière intervention - 12 févr. 2009 à 17:39
0
Merci
Bon, j'ai essayer plusieurs choses mais j'avoue que je seche là...

Voila mon code pour générer les lignes:
<?php
.
.
.
$compteur = 1;
for($compt=$nCommentaires;$compt1>=1;$compt1--) {    // on fait un décompteur
    $lecture=$nopb[$compt1];
    echo '<tr id="'.$compteur.'">
            <form method="post" action="modif_tableau_form.php?lecture='.$lecture.'">
            <td>1ere colonne</td>
            <td>2ecolonne</td>
            <td></td>
            <td>
            </form>
        </tr>';
    $compteur++;
    }
.
.
.
?>

et la fonction javascript:

<script>
function colorier(a) {

//Je veux tester les 2 boutons radio sur chaque ligne
var verif = document.getElementsByTagName('input')[0].checked;
var termine = document.getElementsByTagName('input')[1].checked;
if (verif true) {document.getElementsById('a').style.backgroundColor 'red';}else if (termine true) {document.getElementsById('a')[a].style.backgroundColor 'green';}
else {document.getElementsById('a').style.backgroundColor = 'white';}
}

</script>

Donc voila, ça ne marche pas et j'avoue que j'ai beau essayer d'appliquer ce qu'il y a sur le site du zéro, j'ai du mal et ça ne mène à rien...

Damien
Commenter la réponse de Dams91
PetoleTeam 3435 Messages postés lundi 26 décembre 2005Date d'inscription 14 janvier 2011 Dernière intervention - 14 févr. 2009 à 10:10
0
Merci
Bonjour à tous,
Sous IExplorer je pense qu'il est préférable d'utiliser
l'événement onclick pour plus de réactivité...

<td></td>
;O)
Commenter la réponse de PetoleTeam
Dams91 4 Messages postés mardi 12 septembre 2006Date d'inscription 15 février 2009 Dernière intervention - 15 févr. 2009 à 19:02
0
Merci
Merci tlm ça marche impec ;)

Damien
Commenter la réponse de Dams91

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.