Discussion :

[madinadiouf]

Bonjour,

A la suite d'un click sur un bouton, je crée une ligne supplémentaire.

Cependant je veux quand je sélectionne une valeur sur un champ select situe sur la première cellule, les champs situes sur les autres cellules se replissent par requête selon la valeur choisie.

Ici je veux que nom et situation de famille se renseignent si je choisis un prénom

Code HTML :

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

1
2
3
4
5
6
<table id="tableau">
<th>Prenom</th>
<th>Nom</th>
<th>Situation de famille</th>
</table>
<input type="button" onclick="ajouteLigne('tableau')" value="Ajouter agent"/>

voici le code JS

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
function ajouteLigne(tableID)
{
var table = document.getElementById(tableID);
var ligne = table.insertRow(-1);
 var rowNumber = table.childNodes.length;
 var cell_prenom = ligne.insertCell(0);
var cell_nom = ligne.insertCell(1);
var cell_sitfamille = ligne.insertCell(2);
cell_prenom.innerHTML='<select id="prenom_ag[]"><option value="-1">Choisir prenom</option>';
cell_nom.innerHTML='<input type="text" name="direction[]"/>';
cell_sitfamille.innerHTML='<input type="text" name="sitfamille[]"/>';
}

Quel événement dois-je implémenter sur le champ select prenom sur la même fonction ou une autre fonction ?

[Isher]

Bonjour,

Je dirais que l'évènement onChange sur select me semble un bon départ. soit directement ds la balise HTML

Code :

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

<select onchange="myFunction()">

soit dans le code javascript

Code :

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

1
2
3
4
 
document.getElementById('prenom').addEventListener('change', function(e){
 // ici le code lorsque le prénom change
});

A noter qu'une petite recherche google m'a donné ce lien en 3e réponse:

https://developer.mozilla.org/fr/doc...dEventListener

--
Éric Santonacci

[madinadiouf]

Bonjour,

J'ai utilise un événement "onchange" sur le champ select "prenom" qui appelle un fonction charger_champs().
Par contre cette fonction est imbriquée dans une grande fonction qui se charge d'ajouter des lignes.
Je veux que quand l'utilisateur clique sur le bouton "Ajouter agent", ca cree une ligne avec le les champs prénom, nom et situation famille et quand il sélectionne un prénom, le nom et la situation famille s'affichent en fonction du prénom choisi

voici le

Code HTML :

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

1
2
3
4
5
6
7
8
9
<table id="tableau">
<th>Prenom</th>
<th>Nom</th>
<th>Situation de famille</th>
<th>Grade</th>
<th>Fonction</th>
<th>Direction</th>
</table>
<input type="button" onclick="ajouteLigne('tableau')" value="Ajouter agent"/>

voici le code JS

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
function ajouteLigne(tableID)
{
	var table = document.getElementById(tableID);
	var ligne = table.insertRow(-1);
    var rowNumber = table.childNodes.length;
    var cell_nom = ligne.insertCell(0);
	var cell_prenom = ligne.insertCell(1);
	var cell_sitfamille = ligne.insertCell(2);
	var cell_grade = ligne.insertCell(3);
	var cell_fonction = ligne.insertCell(4);
	var cell_direction = ligne.insertCell(5);
 
	    var codeHTML_prenom= '<select id="prenom_ag[]" onchange="charger_champs(this.value)"><option value="-1">Choisir prenom</option>';
		var codeHTML_nom= '<select id="nom_ag[]"><option value="-1">Choisir nom</option>';
		var codeHTML_sitfamil= '<select id="sitfamille_ag[]"><option value="-1">Choisir situation famille</option>';
		var codeHTML_grade= '<select id="grade_ag[]"><option value="-1">Choisir grade</option>';
		var codeHTML_fonction= '<select id="fonction_ag[]"><option value="-1">Choisir fonction</option>';
		var codeHTML_direct= '<select id="direction_ag[]"><option value="-1">Choisir direction</option>';
	 <?php
	   include('functions.php');
        $bdd_mission_msas=connect();
		$reponse_prenom = $bdd_mission_msas->query('SELECT * FROM  agent');
		 $optionsHTML_prenom="";				
		while ($donnees_prenom = $reponse_direct->fetch())
{
	$optionsHTML_prenom.='<option value="'.$donnees_prenom ['agent_id'].'">'.$donnees_prenom ['prenom'].'</option>';
}
 
$reponse_prenom->closeCursor();
 
?>
codeHTML_prenom+='<?php echo $optionsHTML_prenom ."</select>"; ?>';
 
function charger_champs(prenom_ident)
{
	<?php
$reponse_nom = $bdd_mission_msas->query('SELECT * FROM  agent where agent_id='+prenom_ident+'');
 $optionsHTML_nom="";				
		while ($donnees_nom = $reponse_nom->fetch())
{
	$optionsHTML_nom.='<option value="'.$donnees_nom ['agent_id'].'">'.$donnees_nom ['nom'].'</option>';
}
 
$reponse_nom->closeCursor();
 
?>
codeHTML_nom+='<?php echo $optionsHTML_nom ."</select>"; ?>';
 
 
<?php
	   	$reponse_sitfam = $bdd_mission_msas->query('SELECT * FROM  situation_famille sit,agent ag where (ag.agent_id='+prenom_ident+'and ag.sitfamille_id=sit.sitfamille_id)');
		 $optionsHTML_sitfam="";				
		while ($donnees_sitfamille = $reponse_sitfam->fetch())
{
	$optionsHTML_sitfam.='<option value="'.$donnees_sitfamille ['sitfamille_id'].'">'.$donnees_sitfamille ['siuationfamille'].'</option>';
}
 
$reponse_sitfam->closeCursor();
 
?>
codeHTML_sitfamil+='<?php echo $optionsHTML_sitfam ."</select>"; ?>';
 
}
cell_prenom.innerHTML = codeHTML_prenom;
cell_nom.innerHTML=codeHTML;
 cell_sitfamille.innerHTML = codeHTML_sitfamil;
 
}

Mais a l’exécution, il m'affiche une page blanche
Vous savez pas quelle est la solution ?

Merci d'avance

[Isher]

Bonjour,

Il semble que vous mélangiez le code javascript et le code PHP dans le même source.
Le PHP est exécuté coté serveur pour générer la page html, le code javascript est exécuté coté client dans le navigateur lorsque la page est affichée. Il n'est donc plus possible d'appeler des fonctions PHP.

Le mieux est de créer une API REST et de l'appeler dans le code javascript avec XMLHttpRequest ou mieux avec une librairie comme axios par exemple, puis d'afficher le résultat dans la page.

[madinadiouf]

Bonjour,

je ne maîtrise pas API REST ou les librairies.

Y'as pas un autre moyen ?
Exemple ici

Code :

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

1
2
 
 var codeHTML_prenom= '<select id="prenom_ag[]" onchange="charger_champs(this.value,ligne)"><option value="-1">Choisir prenom</option>';

comment dire que this.value et ligne sont des variables javascript ?