M�langer Javascript & PHP

**_Carole** · 22/05/2013, 09h02

Bonjour,
Je ne suis pas sure de demander quelque chose de possible, � la vue des r�ponses de Google mais je tente ma chance ici.

J'ai un formulaire qui permet d'ajouter un projet. Pas de probl�me d'insertion, etc... Ce formulaire comporte une partie "demande" qui permet de demander des ressources (des jours/hommes d'une �quipe).

Il � cette t�te l� :

Bon, selon que la case "demande" est coch�e, il appara�t mais mon probl�me n'est pas l�.

Au clic sur "ajouter une �quipe", j'aimerais qu'une ligne, identique � la premi�re, se rajoute � la suite de mon tableau. Bon, quand c'est que des champs simples, �a va, j'arrive � me d�brouiller mais l�, ma liste d�roulante est remplie gr�ce aux infos de la BDD (Postgre) et donc, avec PHP.

J'ai cr�er une fonction qui affiche ma liste d�roulante remplie, histoire d'all�ger la fonction javascript mais voil�, �a reste du PHP serveur, dans du javascript client... Je sais.

Voil�, ce que je demande, c'est quelque chose qui pourrait me faire le m�me traitement (ou alors, la bonne m�thode tout simplement).

Place au code

HTML+Javascript

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
function create_champ(i) {
 
var i2 = i + 1;
var champs = '<table><tr><td><select name="role'+i+'"><option> </option><option>C</option><option>P</option></select></td>'+
             '<td><?php affich_equip(equip'+i')?></td>'+
                                '<td><input type="text" style="width:25px" name="01'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="02'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="03'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="04'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="05'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="06'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="07'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="08'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="09'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="10'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="11'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="12'+i+'"></td>'+
                         '</tr></table>';
 
 
document.getElementById('leschamps_'+i).innerHTML = champs;
document.getElementById('leschamps_'+i).innerHTML += (i <= 10) ? '<br /><span id="leschamps_'+i2+'"><a href="javascript:create_champ('+i2+')">Ajouter</a></span>' : '';
 
}

Code html :

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
     <label for="nom">Nom du demandeur :</label><input type="text" id="nom" style="width:300px" value="<?php echo $_SESSION['login']; ?>"><br />
        <br/>             
                     <table>
                         <tr>
                             <th>Rôle</th>
                             <th>Equipe</th>
                             <th>Jan</th>
                             <th>Fév</th>
                             <th>Mar</th>
                             <th>Avr</th>
                             <th>Mai</th>
                             <th>Juin</th>
                             <th>Juil</th>
                             <th>Août</th>
                             <th>Sept</th>
                             <th>Oct</th>
                             <th>Nov</th>
                             <th>Déc</th>
                         </tr>
                         <tr>
                             <td><select name="role"><option> </option><option>C</option><option>P</option></select></td>
                             <td><?php affich_equip(equip)?></td>
                                <td><input type="text" style="width:25px" name="01"></td>
                                <td><input type="text" style="width:25px" name="02"></td>
                                <td><input type="text" style="width:25px" name="03"></td>
                                <td><input type="text" style="width:25px" name="04"></td>
                                <td><input type="text" style="width:25px" name="05"></td>
                                <td><input type="text" style="width:25px" name="06"></td>
                                <td><input type="text" style="width:25px" name="07"></td>
                                <td><input type="text" style="width:25px" name="08"></td>
                                <td><input type="text" style="width:25px" name="09"></td>
                                <td><input type="text" style="width:25px" name="10"></td>
                                <td><input type="text" style="width:25px" name="11"></td>
                                <td><input type="text" style="width:25px" name="12"></td>
                         </tr>
                     </table>
 
                     <span id="leschamps_2"><a href="javascript:create_champ(2)">Ajouter une équipe</a></span>

Fonction PHP (liste d�roulante) affich_equip($nom_liste)

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
function affich_equip($nom_list){
connec_base ();
//Exécution de la requête SQL
   $query = 'SELECT distinct equipe 
   FROM service 
   ORDER BY equipe';  
 
$result = pg_query($query) or die('Échec de la requête : ' . pg_last_error());
// Affichage des résultats en HTML
   echo "<select name='$nom_list'>\n"; 
   echo "<option> </option>";
   while ($line = pg_fetch_array($result, null, PGSQL_ASSOC)) {  
        foreach ($line as $col_value) { 
         echo "\t\t<option>$col_value</option>\n"; 
        }  
   }  
   echo "</select>\n"; 
 
   deco_base (); 
}

PS: Je sais que le Javascript ne fonctionne pas avec :
'<td><?php affich_equip(equip'+i')?></td>'+
mais c'est pour bien me faire comprendre sur mes attentes.

Voil�, en vous remerciant d'avance.

**Bovino** · 22/05/2013, 09h10

Bien entendu, PHP et JavaScript ne peuvent pas �tre utilis�s ensemble : l'un s'ex�cute sur le serveur et l'autre sur le client...

La seule solution est donc d'utiliser AJAX pour aller sur le serveur r�cup�rer les donn�es dont tu as besoin dans ton code JavaScript.

**_Carole** · 22/05/2013, 09h33

C'est bien ce qu'il me semblait... Cependant, je suis une grande d�butante en AJAX (pour pas dire que c'est la premi�re fois) et tout n'est pas clair (m�me si sur tout les tutos que je trouve, les gens disent que c'est simple).

Je trouve beaucoup de chose sur le remplissage automatique d'une seconde liste d�roulante, en fonction de la premi�re... d'histoire d'auto-compl�tion et j'en passe mais rien qui s'apparente � ce que je veux faire. (remplir une liste d�roulante d'infos de la BDD)

Dois-je vraiment tout s�parer en diff�rente page ? (ma fonction php est dans un fichier 'fonctions.php', �a m'embeterais de faire un fichier rien que pour elle). Puis-je garder mon code o� tout est � refaire ?.

----------------------------------
EDIT
�a serait pas plus simple de dupliquer ma ligne ? Puisqu'elle est d�j� pr�sente (liste d�roulante comprise, et elle ne change pas, c'est toujours les m�mes infos)...
C'est faisable ? Appropri� ?

**Agriesean** · 22/05/2013, 10h41

Tu n'as pas d'autres possibilit�s malheureusement que de s�parer ton code php ex�cute pour l'ajax de ton code javascript.

**_Carole** · 22/05/2013, 11h31

Merci pour vos r�ponses.

J'ai trouv� une autre m�thode :

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
 
<script>
function create_champ(i) {
 
var i=parseInt($("#add_equ").attr("increment"));
var contenu_tab=$('#tab_demande').html();
 
var i2 = i + 1;
 
$("#add_equ").attr("increment",i2);
 
var champs = '<tr><td><select name="role_'+i+'"><option> </option><option>C</option><option>P</option></select></td>'+
             '<td><select name="equipe_'+i+'">'+$('.liste_equ').html()+'</select></td>'+
                                '<td><input type="text" style="width:25px" name="01_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="02_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="03_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="04_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="05_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="06_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="07_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="08_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="09_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="10_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="11_'+i+'"></td>'+
                                '<td><input type="text" style="width:25px" name="12_'+i+'"></td>'+
                         '</tr>';
 
contenu_tab=contenu_tab+champs;
 
$('#tab_demande').html(contenu_tab);
 
/*document.getElementById('leschamps_'+i).innerHTML = champs;
document.getElementById('leschamps_'+i).innerHTML += (i <= 10) ? '<br /><span id="leschamps_'+i2+'"><a href="javascript:create_champ('+i2+')">Ajouter</a></span>' : '';
*/
}
 
 
</script>

Code HTML :

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
 
 <table id="tab_demande">
                         <tr>
                             <th>Rôle</th>
                             <th>Equipe</th>
                             <th>Jan</th>
                             <th>Fév</th>
                             <th>Mar</th>
                             <th>Avr</th>
                             <th>Mai</th>
                             <th>Juin</th>
                             <th>Juil</th>
                             <th>Août</th>
                             <th>Sept</th>
                             <th>Oct</th>
                             <th>Nov</th>
                             <th>Déc</th>
                         </tr>
                         <tr>
                             <td><select name="role"><option> </option><option>C</option><option>P</option></select></td>
                             <td><?php echo affich_equip(equipe_0); ?></td>
                                <td><input type="text" style="width:25px" name="01_0"></td>
                                <td><input type="text" style="width:25px" name="02_0"></td>
                                <td><input type="text" style="width:25px" name="03_0"></td>
                                <td><input type="text" style="width:25px" name="04_0"></td>
                                <td><input type="text" style="width:25px" name="05_0"></td>
                                <td><input type="text" style="width:25px" name="06_0"></td>
                                <td><input type="text" style="width:25px" name="07_0"></td>
                                <td><input type="text" style="width:25px" name="08_0"></td>
                                <td><input type="text" style="width:25px" name="09_0"></td>
                                <td><input type="text" style="width:25px" name="10_0"></td>
                                <td><input type="text" style="width:25px" name="11_0"></td>
                                <td><input type="text" style="width:25px" name="12_0"></td>
                         </tr>
                     </table>
 
                     <span id="leschamps_2"><a id="add_equ" href="javascript:create_champ(2)" increment="2">Ajouter une équipe</a></span>

Pour faire simple, je r�cup�re le html d�j� g�n�r� de ma liste d�roulante pr�c�dente.

Voil�, Bonne journ�e!

M�langer Javascript & PHP

JavaScript

Discussions similaires

Partager

Partager