Bonjour,
Je cherche à rendre un peu plus dynamique une page de mon site de gestion de projet. Dans celui-ci, j'ai une liste de projets dans lesquels il est possible de choisir l'état de tel ou tel projet à travers un select (quand on ouvre la fiche du projet), le tout affiché dans un tableau.
J'ai commencé à regarder tout ça ce matin, j'avoue que je patauge un peu. J'ai trouvé un script qui fonctionne mai j'ai un problème d'id.
Je ne connais pas le nombre de listes qu'il peut y avoir et l'id des select est aléatoire du genre post_flux$id_projet.
Voici le script que j'ai :
Ma fonction d'affichage de lsite :
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 function getXMLHttpRequest() { var xhr = null; if (window.XMLHttpRequest || window.ActiveXObject) { if (window.ActiveXObject) { try { xhr = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } } else { xhr = new XMLHttpRequest(); } } else { alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest..."); return null; } return xhr; } function submitFlux(callback,var_js) { // var_js me permet de transférer l'id du projet pour construire les noms des id de formulaire var xhr = getXMLHttpRequest(); xhr.onreadystatechange = function() { if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) { callback(xhr.responseText); } }; //declaration des v var NomIdProjet = 'post_projet_id'+ var_js; //nom des id de formulaire var NomIdFlux = 'post_flux_id'+ var_js; var projet_id2 = encodeURIComponent(document.getElementById(NomIdProjet).value); var flux_id2 = encodeURIComponent(document.getElementById(NomIdFlux).value); idBloc2 = 'flux'+ var_js; alert(idBloc2); xhr.open("POST", "modules/M_projets/vues/ajax-general.php", true); xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xhr.send("post_projet_id="+ projet_id2 +"&post_flux_id="+ flux_id2); document.getElementById(idBloc2).innerHTML = xhr.reponseText; delete(flux_id2); delete(projet_id2); } function readData(sData) { //alert(sData); document.getElementById(idBloc2).innerHTML = sData; // affichage après tratement de ma liste, mais pour le moemnt je n'rrive pas à transférer idBloc2 delete(idBloc2); }
Code php : 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 <?php function formListeFluxAjax($flux_id,$type,$projet_id){ echo ' <form method="post">'; $flux_id = intval($flux_id); $type = intval($type); $projet_id = intval($projet_id); $readData = 'flux'.$projet_id; ?> <script type='text/JavaScript'> var var_js= <?php echo($projet_id); ?>; </script> <?php if (empty($type) OR $type == 0 OR $type == ' ') { $sql_type = ''; } else { $sql_type = 'WHERE flux_type = '.$type; } if ($flux_id >= 1) { $acq_flux = mysql_query("SELECT * FROM flux WHERE flux_id = ".$flux_id." ") or die ('Erreur : '.mysql_error()) ; $flux = mysql_fetch_assoc($acq_flux); echo '<select name="flux_id" style="background:'.$flux['flux_color'].';" onChange="submitFlux(readData,var_js)" id="post_flux_id'.$projet_id.'">'; echo '<option value="'.$flux['flux_id'].'" style="background:'.$flux['flux_color'].';">'. htmlentities(stripslashes($flux['flux_nom'])).'</option>'; } else { echo '<select name="flux_id" onChange="submitFlux(readData,var_js)" id="post_flux_id'.$projet_id.'">'; } $i =0; $acq_flux = mysql_query("SELECT * FROM flux ".$sql_type." ") or die ('Erreur : '.mysql_error()) ; while ( $flux = mysql_fetch_assoc($acq_flux)) { echo '<option value="'.$flux['flux_id'].'" style="background:'.$flux['flux_color'].';">'. htmlentities(stripslashes($flux['flux_nom'])).'</option>'; $i++; } echo '</select> '; echo '<input type="hidden" name="projet_id" value="'.$projet_id.'" id="post_projet_id'.$projet_id.'" />'; echo '<input type="hidden" name="fluxIdBloc" value="flux'.$projet_id.'" id="post_fluxIdBloc'.$projet_id.'" />'; echo '</form>'; }
Elle est appelée dans ma vue :
Code php : 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 <tr > <td style="background:<?php echo $liste['projet_type']['couleur']; ?>"> <?php echo $liste['projet_type']['nom']; ?> </td> <td> <?php echo $nomSociete; ?> </td> <td> <?php echo $liste['projet_nom']; ?></td> <td > <div id="flux<?php echo $liste['projet_id'] ?>"> // div pour réafficher le contenu du ficher de traitement <?php echo formListeFluxAjax($liste['flux']['id'],2,$liste['projet_id']); ?> </div> </td> <td> <?php echo $liste['actions']; ?></td> <?php if ( $_SESSION['niv_autorisation'] == 1) { ?> <td> <?php echo $liste['projet_cout']; ?></td> <?php } ?> <td> <?php echo $liste['projet_tps_passe']; ?></td> <td> <?php echo $liste['flux']['avcmt']; ?> % </td> </tr>
Pour résumer, j'ai une liste de projets dans un tableau, je souhaite ajouter un select pour changer l'état d'avancement du projet directement dans mon tableau. Je ne connais pas le nombre de projets ou les id, tout est dynamique et les champs de mon formulaire sont de ce type : post_projet_id$id_projet, pour avoir des id uniques.
Si quelqu'un a une "ID".
Sinon peut être une autre solution sans devoir réactualiser le page quand il y a près de 200 lignes, c'est un peu lourd.
Partager