Modifier la couleur de fond d'une cellule

ZeDevil · 13 Juin 2006

Bonjour,

Voilà j'ai un tableau, ou je voudrais modifier la couleur de fond, mais cellule par cellule.

Et faire cela en PHP bien sur, parceque avec un editeur, je sais le faire........... :smartass:

Merci.

EDIT:

Apres relecture, je sais pas trop si je me suis assez exprimé sur le sujet. Pas facile de savoir exactement ce que je cherche.

Donc un petit edit pour le coup, ne me fera pas de mal.

Je voudrais donc un tableau, ou il y aurait plusieurs cellules (noir et blanche).

Se tableau serait affiché seulement avec les couleurs et un autre en dessous ou sur une autre page, peu importe permettrai de changer celui ci. De passer du blanc au noir en cliquant soit dans la cellule soit sur un texte dans la cellule. Et de valider le tout pour que cela soit visible sur le premier tableau rien qu'en couleur.

Modifié 13 Juin 2006 par ZeDevil

**captain_torche** · 13 Juin 2006

Tu pourrais être plus précis ?

Tu cherches à attribuer les couleurs en fonction de quoi ?

ZeDevil · 13 Juin 2006

J'ai edité pour etre plus clair captain.

En fonction de la couleur, noir ou blanc.

Donc il y aurait un texte par exemple dans la cellule qui serait:

noir - blanc et lorsque l'on clique sur l'un des 2, il permet de changer la couleur, pas instantannément bien sur mais apres par exemple avoir appuyé sur un bouton qui validerai le tout.

**Portekoi** · 13 Juin 2006

Bonjour,

J'ai pas tout compris non plus mais tu peux faire ceci :

<a href="page.php?couleur=#000000"> Changer la couleur en Noir </a>
<a href="page.php?couleur=#FFFFFFF"> Changer la couleur en Blanc</a>

<!-- Dans le tableau -->
<table>
<tr>
 <td bgcolor="<?=$_GET["couleur"]?>"> Mon texte ici</td>
</tr>
</table>

Je sais pas si c'est ce que tu veux...

Portekoi

ZeDevil · 13 Juin 2006

Je vais prendre un exemple pour etre clair, enfinessayer de l'etre.

J'ai un tableau de 2 cellules sur 2 cellules.

__________

| | |

|____|_____|

| | |

|____|_____|

Bon ok, c'est pas tres beau.

Je veux que la couleur de fond de la cellule soit modifiée. Et ceux lorsque par exemple sur clique sur un texte se trouvant à l'intérieur de cette cellule. Je veux du noir et du blanc.

__________

| N | N |

|__B_|_B__|

| N | N |

|__B_|__B_|

Quand je clique sur N, le fond de la cellule deviendra Noir, et quand je clique sur B, le fond de la cellule devriendra Blanc.

Mais seulement apres avoir cliqué sur le bouton modifié se trouvant en dessous. Ex:

__________

| N | N |

|__B_|_B__|

| N | N |

|__B_|__B_|

________

| modifier |

Comme ca je peux modifier plusieurs couleur de fond en meme temps et apres envoyer les modification, qui se verront sur un autre tableau résumant les modifications de couleur de fond, ou il n'y aura pas les N et B du tableau.

J'espere que là je suis clair..... :unsure:

**captain_torche** · 13 Juin 2006

Pour un truc comme ça, j'utiliserai un tableau multidimensionnel :

$tab_couleurs = array(
0 => array('couleur col0', 'couleur col1'),
1 => array('couleur col0', 'couleur col1')
);

Avec en première donnée, le numéro de la ligne, et en seconde, celui de la colonne.

Ce qui te donnerait, après un p'tit print_r :

Array
(
	[0] => Array
		(
			[0] => #FFF
			[1] => #000
		)

	[1] => Array
		(
			[0] => #000
			[1] => #FFF
		)
)

**Portekoi** · 13 Juin 2006

Et bien ma solution devrait te convenir

Remplace lien par un bouton de formulaire et roule

mamijo · 13 Juin 2006

c'est possible en javascript (c'est le principe du DHTML qui change le style), et c'est plus facile en PHP mais l'inconvénient c'est qu'il faut attendre que le serveur exécute les changements... C'est vraiment ce que tu veux ?

edit : corrections bêtises clavier

Modifié 13 Juin 2006 par mamijo

ZeDevil · 13 Juin 2006

Et bien ma solution devrait te convenir

Bah j'aurais bien aimé, mais deja le script ne marche pas........ :blush:

C'est vraiment ce que tu veux ?

Bah moi je veux quelque chose qui marche...........de préférence en PHP. Apres je ne pense pas que cela soit tres long a executer non plus.....

Pour un truc comme ça, j'utiliserai un tableau multidimensionnel :

Rien que le nom me fait peur.......

**Portekoi** · 13 Juin 2006

Qu'est ce qui marche pas?

Je veux t'aider mais sois plus locace....

As tu changé mapage.php par ta propre page?

As tu une erreur? Si oui laquelle?

ZeDevil · 13 Juin 2006

Oui oui j'ai changé le mapage par le nom de ma page, quand je remplace le <?=$_GET["couleur"] ?> par une couleur, ca me la change.......

Je n'ai pas d'erreur, mais je pense que c'est moi qui ai oublié de mettre quelque chose.

C'est le "=" dans <?=$_GET["couleur"] ?> que je trouve bizare non ???

Et si je l'enleve bah ca ne marche pas non plus

Pour couleur, il ne faut pas faire quelque chose, il la trouve comme ca !

Modifié 13 Juin 2006 par ZeDevil

**Portekoi** · 13 Juin 2006

Mais non... tu dois cliquer sur les liens, au dessus :

<a href="page.php?couleur=#000000"> Changer la couleur en Noir </a>
<a href="page.php?couleur=#FFFFFF"> Changer la couleur en Blanc</a>

Quand tu cliques dessus, est ce que ca change de couleur?

le "=" permet d'afficher le code couleur demandé...

**captain_torche** · 13 Juin 2006

La solution de Portekoi, te permet de changer la couleur de toutes les cellules du tableau.

Sinon, pour le <?=$_GET['couleur']?>, le '=' est équivalent à 'echo'.

ZeDevil · 13 Juin 2006

J'ai regardé le code de la page affiché et ca me donne ca:

<td bgcolor="">text</td>

Mais non... tu dois cliquer sur les liens, au dessus :

le "=" permet d'afficher le code couleur demandé...

Oui oui, j'ai bien compris le fonctionnement

Ok pour le "="

EDIT:

Me revoilà, j'ai n'ai pas pu acceder au forum depuis 11h30........

Bon bah ca ne marche toujours pas quoi.

Modifié 13 Juin 2006 par ZeDevil

ZeDevil · 13 Juin 2006

Voilà en fait un modele de cellule:

<form action='page.php' ENCTYPE='multipart/form-data' method='post'> //je ne sais pas trop comment sa doit partir
<table>
<td align='center' bgcolor='#FFFFFF'><br><select name='s1' size='2' style='font-family: Arial; font-size: 8pt'>
					<option value='#000000'>noir
					<option value='#FFFFFF'>blanc
				</select>
</table>

<INPUT type='button' onClick='[i]validation[/i]' value='Modifier'>

Quand on clic sur noir le fond devient noir et quand on clic sur le blanc, bah ca devient blanc. Mais apres validation du formulaire bien sur.

**captain_torche** · 13 Juin 2006

On va voir si j'ai bien compris :

Je t'ai fignolé un p'tit peu de code (j'avais un peu de temps devant moi).

<?php
[color="#FF0000"]//	On définit le nombre de lignes et de colonnes qu'on désire pour les tableaux[/color]
$nb_lignes = 5;
$nb_cell = 5;

[color="#FF0000"]//	On met les couleurs disponibles dans un array, pour pouvoir en ajouter facilement si besoin[/color]
$couleurs = array(
	1 => array('Noir', '000'),
	2 => array('Blanc', 'FFF'),
	3 => array('Rouge', 'F00')
);
?>
<html>
<head>
<style type="text/css">
table {
	width: 200px;
	height: 200px;
}
table, td {
	border: 1px solid black;
}
<?php
	[color="#FF0000"]//	On effectue une boucle pour créer une classe CSS par élément de notre tableau $couleurs[/color]
	foreach($couleurs as $num => $tab_coul)
		echo '.coul_'.$num.' { background-color: #'.$tab_coul[1].'}';
?>
</style>
</head>
<body>
<?php
[color="#FF0000"]//	Le code qui remplit le tableau (array) avec les valeurs demandées dans le formulaire[/color]
$tab_couleurs = array();
if(isset($_POST['Envoi']))	{
	for($l = 1; $l <= $nb_lignes; $l++) {
		for($c = 1; $c <= $nb_cell; $c++)
			$tab_couleurs[$l][$c] = $_POST['sel_'.$l.'_'.$c];
	}
}

[color="#FF0000"]/*	Tu peux activer ce morceau de code si tu veux voir le contenu de l'array
echo '<pre>';
print_r($tab_couleurs);
echo '</pre>';
*/[/color]

[color="#FF0000"]//	Construction du premier tableau, en fonction du nombre de lignes et de colonnes[/color]
echo '<table>';
for($l = 1; $l <= $nb_lignes; $l++)	{
	echo '<tr>';
	for($c = 1; $c <= $nb_cell; $c++)	{
		$class = (isset($tab_couleurs[$l][$c])) ? ' class="coul_'.$tab_couleurs[$l][$c].'"' : '';
		echo '<td'.$class.'> </td>';
	}
	echo '</tr>';
}
echo '</table>';


echo '<h2>Formulaire : </h2>';

[color="#FF0000"]//	Constructiion du même tableau que précédemment, mais avec les champs de formulaire[/color]
echo '<form name="test" method="post">';
echo '<table>';
for($l = 1 ; $l <= $nb_lignes; $l++)	{
	echo '<tr>';
	for($c = 1; $c <= $nb_cell; $c++)	{
		echo '<td>';
		[color="#FF0000"]//	Chaque select est construit de la manière suivante : sel_numeroligne_numerocolonne[/color]
		echo '<select name="sel_'.$l.'_'.$c.'">';
		[color="#FF0000"]//	On génère ici autant d'options qu'on a d'éléments dans l'array $couleurs[/color]
		foreach($couleurs as $num => $tab_couleur) {
			$selected = ($tab_couleurs[$l][$c] == $num) ? ' selected="selected"' : '';
			echo '<option value="'.$num.'"'.$selected.'>'.$tab_couleur[0].'</option>';
		}			
		echo '</select>';
		echo '</td>';
	}
	echo '</tr>';
}
echo '</table>';
echo '<input type="submit" name="Envoi" value="Envoyer" />';
echo '</form>';
echo '<body>';
echo '</html>';
?>

Ca te convient ?

ZeDevil · 13 Juin 2006

Déjà, rien que pour le temps passé dessus, je te remercie.

Je vais tester ca tout de suite. Pour voir ce que ca donne.

EDIT:

Ecoute Captain, ca m'a l'air tres bon. Juste que j'ai un p'tit soucis de mise en page, vu que je l'integre deja dans une page, et dans un tableau.

J'suis en train de virer les balises html et tout ce que j'ai deja pour voir le résultat. Mais on dirait bien que c'est ce que je cherchais a faire.

Je l'ajuste a ma page, et je te dis ce qu'il en est.

Merci en tout cas pour le boulo......

Modifié 13 Juin 2006 par ZeDevil

ZeDevil · 13 Juin 2006

Alors résultat du test:

J'éprouve quelques petits soucis.

Je voudrais donc que sur une page, on puisse modifier, mais que cela soit visible sur une autre page et pas sur la meme page. Et que cela soit gardé en mémoire. Puisque apparemment, bah là ca revient à la base a chaque fois. En tout cas le principe du truc est bon......c'est ca que je cherche.

J'ai du virer la largeur de la table dans le <head> car ca me plante tout mes tableau.....

Je sais je suis chiant.

Modifié 13 Juin 2006 par ZeDevil

**captain_torche** · 13 Juin 2006

C'est bien ce que je me disais, pour la 'mise en mémoire'. Mais bon, t'étais un peu évasif au début.

Bon, j'essaye de te fignoler quelque chose pour ça, et je te tiens au courant.

ZeDevil · 13 Juin 2006

je te tiens au courant.

Ok, c'est tres gentil..........

Au fait, je voulais te le dire, sympas ton avatar. c'est de ta main ?

Modifié 13 Juin 2006 par ZeDevil

**captain_torche** · 13 Juin 2006

Non, l'avatar n'est pas de moi (je sais pas dessiner). Il est tiré d'une BD d'un pote fanzineux.

Sinon, petites modifs dans le script :

- il faut désormais avoir un fichier 'tableau.txt' dans le même répertoire que ton autre fichier.

- Le nouveau script gère donc la lecture/écriture de ce fichier.

<?php
//	On définit le nombre de lignes et de colonnes qu'on désire pour les tableaux
$nb_lignes = 5;
$nb_cell = 5;

[color="#FF0000"]//	On choisit un fichier dans lequel seront stockéés les infos de couleur
$fichier = 'tableau.txt';[/color]

//	On met les couleurs disponibles dans un array, pour pouvoir en ajouter facilement si besoin
$couleurs = array(
	1 => array('Noir', '000'),
	2 => array('Blanc', 'FFF'),
	3 => array('Rouge', 'F00'),
	4 => array('Bleu', '00F')
);
?>
<html>
<head>
<style type="text/css">
table {
	width: 200px;
	height: 200px;
}
table, td {
	border: 1px solid black;
}
<?php
	//	On effectue une boucle pour créer une classe CSS par élément de notre tableau $couleurs
	foreach($couleurs as $num => $tab_coul)
		echo '.coul_'.$num.' { background-color: #'.$tab_coul[1].'}';
?>
</style>
</head>
<body>
<?php
//	Le code qui remplit le tableau (array) avec les valeurs demandées dans le formulaire
$tab_couleurs = array();
if(isset($_POST['Envoi']))	{
	for($l = 1; $l <= $nb_lignes; $l++) {
		for($c = 1; $c <= $nb_cell; $c++)
			$tab_couleurs[$l][$c] = $_POST['sel_'.$l.'_'.$c];
	}
	[color="#FF0000"]//	On enregistre le résultat dans le fichier tableau.txt
	$contenu = '';
	foreach($tab_couleurs as $liste_couleurs)
		$contenu .= implode(';', $liste_couleurs)."\r\n";
	$file = fopen($fichier, 'w+');
	fwrite($file, $contenu);
	fclose($file);
}

//	On lit le fichier pour créer l'array
$array = file($fichier);
array_unshift($array, 0);
foreach($array as $l => $cellules) {
	$tab_cellules = explode(';', $cellules);
	array_unshift($tab_cellules, 0);
	foreach($tab_cellules as $c => $couleur)
		$tab_couleurs[$l][$c] = $couleur;
}[/color]

//	Tu peux activer ce morceau de code si tu veux voir le contenu de l'array
/*
echo '<pre>';
print_r($tab_couleurs);
echo '</pre>';
*/

//	Construction du premier tableau, en fonction du nombre de lignes et de colonnes
echo '<table>';
for($l = 1; $l <= $nb_lignes; $l++)	{
	echo '<tr>';
	for($c = 1; $c <= $nb_cell; $c++)	{
		$class = (isset($tab_couleurs[$l][$c])) ? ' class="coul_'.$tab_couleurs[$l][$c].'"' : '';
		echo '<td'.$class.'> </td>';
	}
	echo '</tr>';
}
echo '</table>';


echo '<h2>Formulaire : </h2>';

//	Constructiion du même tableau que précédemment, mais avec les champs de formulaire
echo '<form name="test" method="post">';
echo '<table>';
for($l = 1 ; $l <= $nb_lignes; $l++)	{
	echo '<tr>';
	for($c = 1; $c <= $nb_cell; $c++)	{
		$class = (isset($tab_couleurs[$l][$c])) ? ' class="coul_'.$tab_couleurs[$l][$c].'"' : '';
		echo '<td'.$class.'>';
		//	Chaque select est construit de la manière suivante : sel_numeroligne_numerocolonne
		echo '<select name="sel_'.$l.'_'.$c.'">';
		//	On génère ici autant d'options qu'on a d'éléments dans l'array $couleurs
		foreach($couleurs as $num => $tab_couleur) {
			$selected = ($tab_couleurs[$l][$c] == $num) ? ' selected="selected"' : '';
			echo '<option value="'.$num.'"'.$selected.'>'.$tab_couleur[0].'</option>';
		}			
		echo '</select>';
		echo '</td>';
	}
	echo '</tr>';
}
echo '</table>';
echo '<input type="submit" name="Envoi" value="Envoyer" />';
echo '</form>';
echo '<body>';
echo '</html>';
?>

Sinon, petite question : à quelle fin ça va te servir, tout ça ?

[Edit :]Petite fioriture : j'ai ajouté le fond de couleur au tableau de formulaire également.

Modifié 13 Juin 2006 par captain_torche

ZeDevil · 13 Juin 2006

Sinon, petite question : à quelle fin ça va te servir, tout ça ?

Bah c'est beau, non ? :hypocrite:

Non plus sérieusement, c'est pour contabiliser par couleur les jours de l'année. Une couleur étant une référence à un code. Et la modification doit se faire en ligne comme on est plusieurs à les faire.

Le truc, c'est qu'on ne peux pas ecrire dans le tableau apparemment....

Comment je fais si je veux que le tableau (en couleur) s'affiche sur une autre page que celle ci.

Modifié 13 Juin 2006 par ZeDevil

**captain_torche** · 13 Juin 2006

Ben, tu adaptes le script

Plus sérieusement, tu copies la création de l'array à partir du fichier, et la création du tableau en elle-même.

Mais, si le but final, était de créer un calendrier, je ne pense pas que çe soit la solution la plus facile (et la plus pratique).

ZeDevil · 13 Juin 2006

Je suis en train de modif le script.

Heu oui, j'aurais peut etre du dire que c'était un calendrier, j'y ai pas penser......

Modifié 13 Juin 2006 par ZeDevil

**captain_torche** · 13 Juin 2006

Ca aurait tout de même pu nous orienter vachement mieux.

Parce que, pour un calendrier, le plus pratique consiste quand même à utiliser une base de données.

Connexion

Modifier la couleur de fond d'une cellule

Sujets conseillés

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Lien vers le commentaire

Partager sur d’autres sites

Veuillez vous connecter pour commenter