Discussion :

[david33b]

Bonjour,

je ne m'y connais pas bien en PHP ou javascript.
Voila.
j'ai une page avec déja deux submit, un affichant une liste de projet situé en haut,
le second en bas servant à écrire et envoyer une nouvelle tache.
Les taches une fois émises apparaissent dans un cadre central
Voici un rapide schéma pour mieux comprendre :

liste projets à selectionner
-------------------------------------------

taches 1 bouton A faire bouton en cours bouton achevé Bouton Save
taches 2 bouton A faire bouton en cours bouton achevé Bouton Save
taches 3 bouton A faire bouton en cours bouton achevé Bouton Save
-----------------------------------

Text area [...........................] Bouton Envoyer

Ce que je souhaiterais faire, c'est que l'on puisse cocher le bouton 1 A faire et que la tache sélectionnée s'enregistre dans un champ disons taches_etat mais que le texte enregistré Afaire devienne rouge.

De même pour les bouton En cours et Achevé qui enregistrent les taches dans taches_etat et les font apparaitre en d'autres couleurs.

Cela est-il possible sachant que j'ai déja deux submit dans ma page?
Si vous pouviez m'aider. merci

[emmanuel.remy]

Voilaà le type de code que tu peux adapter ou piocher selon tes besoins:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
    <form>
    <div>
    tache 1 <button onclick="this.form.taches_etat.value += ' tache1';
                             this.style.color='red'">A Faire</button><br>
 
    tache 2 <button onclick="this.form.taches_etat.value += ' tache2';
                             this.style.color='red'">A Faire</button><br>
 
    <input type="text" name="taches_etat" value="" />
    </form>

ERE

[david33b]

Bonjour, merci de ta réponse mais j'aimerais procéder de la sorte.
EN fait, je souhaiterais que sur mon formulaire, (sans passer par un submit) lorsque l'utilisateur coche une checkbox (qui fait alors changer de couleur la ligne correspondante) , cet état s'enregistre ainsi que la checkbox cochée.

voici mon code PHP

Code :

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

echo'<td><input type="checkbox" name="afaire[]" onchange="rouge(this);" /></td>';

et mon code javascript pour la couleur

Code :

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

1
2
3
4
5
6
function rouge(rouge)
    {    if ( rouge.checked )
	rouge.parentNode.parentNode.style.color="#bc1f1f";
          else    
       rouge.parentNode.parentNode.style.color="white";
      }

ca doit être possible tout de même sans passer par la base de données,
une fonction javascript qui retourne sur la page l'état enregistré..

merci!

[andry.aime]

Salut,
Utilise onclick à la place de onchange pour le changement de la couleur local.
Pour l'enregistrement utilise une requête AJAX.

Code :

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

1
2
3
4
5
6
7
8
9
10
function rouge(rouge)
{
	if(rouge.checked)
{rouge.parentNode.parentNode.style.color="#bc1f1f";
//enregistrement via AJAX ICI
}
	else{rouge.parentNode.parentNode.style.color="white";
//enregistrement via AJAX ICI
}
}

[david33b]

Bonjour, je te remercie pour ta réponse.
Je vois qu'il faut absolument que j'utilise Ajax..
le problème c'est que je n'y connais rien..
je pensais que je pouvais peut-être passer par un cookie en php pour éviter de recharger la page et conserver les données mais je n'obtiens rien ..

Désolé de te demander ca mais pourrais-tu m'en dire davantage sur la fonction AJAX pour enregistrer ce type de requête??

merci encore et désolé je suis vraiment débutant en PHP alors en Ajax...
Merci beaucoup..

[andry.aime]

Code JAVASCRIPT :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
function createXHR() 
{
    var request = false;
        try {
            request = new ActiveXObject('Msxml2.XMLHTTP');
        }
        catch (err2) {
            try {
                request = new ActiveXObject('Microsoft.XMLHTTP');
            }
            catch (err3) {
		try {
			request = new XMLHttpRequest();
		}
		catch (err1) 
		{
			request = false;
		}
            }
        }
    return request;
}
function savecolor(couleur,id) 
{
	var xhr=createXHR();
			xhr.open("POST", "page.php",true);
			xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
			xhr.onreadystatechange = function()
			{ 
			if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
				{
					alert(xmlhttp.responseText);
				}
			}
			var donnee='couleur='+couleur+'&id='+id;
			xhr.send(donnee); 
}
function rouge(rouge,id)
{
	if(rouge.checked)
{rouge.parentNode.parentNode.style.color="#bc1f1f";
	savecolor('#bc1f1f',id);
}
	else{rouge.parentNode.parentNode.style.color="white";
	savecolor('white',id);
}
}

J'ai mis id en paramètre si la ligne modifiée en a une.
Du coté php

Code PHP :

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

1
2
3
4
5
6
7
<?php
	if(isset($_POST['couleur']) && isset($_POST['id']))
	{
		//La requete pour l'enregistrement ici;
		echo'Couleur enregistré';
	}
?>

[david33b]

Merci beaucoup de t'être penché sur mon problème.
finalement, je ne me suis servi que de php.plus besoin d'ajax ni de javascript.
Tout marche impec.
Je poste ma page si cela peut aider quelqu'un.
Merci encore.

// Si au moins un checkbox est coché

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
if(isset($_POST['tache1'])){ 
	$nb_taches = $_POST['ligne']; // On récupère le nombre de tâches du projets, soit le nombre d'update qu'on aura à faire
	$modif_id = ""; // création d'une variable vide
	$modif_tache = "";
	for($i=1; $i<=$nb_taches; $i++){ // tant qu'on a des updates à faire
		$tache = 'tache'.$i;
		$id = 'id'.$i;
		foreach($_POST as $key => $value){ // on parcourt toutes les variables $_POST pour récupérer les valeurs qui nous intéressent
			if($key == $tache) $modif_tache = $value;
			if($key == $id) $modif_id = $value;
		}
		$requete_modification = "UPDATE taches SET taches_etat='".$modif_tache."' WHERE taches_id='".$modif_id."'";
		$execution_modification = mysql_query($requete_modification);
	}
}
?>
 
<form name="choix_projet" method="post" action="suivi_projets.php">
			<select name="projet" onchange=" choix_projet.submit();">
			<option value="">Choisissez un projet</option> <!-- il faut cette ligne pour avoir obligatoirement un changement -->
				<?php
                                        $requete_projets = "SELECT * FROM projets ORDER BY projets_num";
                                        $execution_projets = mysql_query($requete_projets);
                                                while($liste_projets = mysql_fetch_array($execution_projets)){
                                                        // Liste déroulante
                                                        $projet_num = $liste_projets['projets_num'];
                                                        $projet_description = $liste_projets['projets_description'];
                                                                if($projet_num == $projet_selectionne){
                                                                        echo '<option value="'.$projet_num.'"  selected="selected">'.$projet_num.' - '.$projet_description.'</option>'; }
                                                                else {
                                                                        echo '<option value="'.$projet_num.'">'.$projet_num.' - '.$projet_description.'</option>'; }
                                                }
                                ?>
			</select>
			<p></p></td></tr>
	</table>
 
<!-- Si un projet est sélectionné on crée le tableau d'affichage des tâches -->
<?php if($projet_selectionne != ""){?><table> 
	<tr>
		<td class="big"><p class="action">TACHES DU PROJET</p></td>
		<td><p class="action" style="color:#bc1f1f">A faire</p></td>
		<td><p class="action" style="color:#fcbe37">En cours</p></td>
		<td><p class="action" style="color:#4cc34f">Achevé</p></td>
	</tr>
	<?php
		$ligne = 0;
		$requete_taches = "SELECT * FROM taches WHERE projets_id = '".$projet_selectionne."'";
		$execution_taches = mysql_query($requete_taches);
		while($liste_taches = mysql_fetch_array($execution_taches)){
			$ligne++;
 
			// Description de la tâche et choix de la couleur
			switch ($liste_taches['taches_etat']){
			case "afaire": echo '<tr><td style="color:#bc1f1f">'.$liste_taches['taches_description'].'</td>'; break;
			case "encours": echo '<tr><td style="color:#fcbe37">'.$liste_taches['taches_description'].'</td>'; break;
			case "acheve": echo '<tr><td style="color:#4cc34f">'.$liste_taches['taches_description'].'</td>'; break;
			default: echo '<tr><td>'.$liste_taches['taches_description'].'</td>';
			}
 
			// A faire
			echo '<td><input type="radio" name="tache'.$ligne.'" value="afaire" id="afaire" ';
			if($liste_taches['taches_etat'] == "afaire") { echo 'checked="checked"'; }
			echo '/></td>';
 
			// En cours
			echo '<td><input type="radio" name="tache'.$ligne.'" value="encours" id="encours" ';
			if($liste_taches['taches_etat'] == "encours") { echo 'checked="checked"'; }
			echo '/></td>';
 
			// Achevé
			echo '<td><input type="radio" name="tache'.$ligne.'" value="acheve" id="acheve" ';
			if($liste_taches['taches_etat'] == "acheve") { echo 'checked="checked"'; }
			echo '/></td>';
 
			// Champ caché contenant l'identifiant de la tache à modifier
			echo '<input type="hidden" name="id'.$ligne.'" value="'.$liste_taches['taches_id'].'" /></tr>';
		}
		// Champ caché contenant le nombre de tâches du projet
		echo '<input type="hidden" name="ligne" value="'.$ligne.'" />';
	?>
</table><?php } // Fin du if ?>
	<p align="center"><input type="submit" value="Save" /></p>