Discussion :

[Skunka]

Bonjour, bonsoir !

Dans le cadre de mon stage, je développe actuellement une appli web (qui n'est pas mon point fort) et je suis face à un problème: sur une page de test où j'affiche les différent poste de l'entreprise, j'ai un bouton 'modifier'. Celui m'ouvre un "modal" dans lequel j'ai une liste déroulante (remplie par une requête SQL) qui me permet de choisir un poste existant. Ensuite, les données relatives à ce post doivent s'afficher dans un formulaire pour que l'utilisateur puisse apporter les modifications. Or, je n'arrive pas à remplir ce formulaire, à la suite de quoi la modification n'est pas prise en compte sur la BDD. J'espère que mes attentes sont bien comprises !

Voici le "modal" pour la modification:



Le code correspondant:

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
 
	<!-- Bouton pour ouvrir le popup de création et modification-->
	<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal1"> Nouveau </button> <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal"> Modifier </button>  
 
	<!-- popup de modification -->
	<div id="myModal" class="modal fade" role="dialog">
	  	<div class="modal-dialog">
 
	    <!-- contenu du popup-->
	    	<div class="modal-content">
	      		<div class="modal-header"> <!-- En-tête -->
	        		<button type="button" class="close" data-dismiss="modal">&times;</button>
 
	        			<p> <!-- Liste déroulante -->
							<form method="POST" action="Scripts/posteSalarie_update.php">
								<select name="selec[]" size="1" style="width: 230px" onchange="Change(this.value)">
									<option value="0"> - - - - - - - - </option>
									<?php
									$req = "SELECT * FROM posteSalarie ORDER BY nomPoste";
									try{
										$stmt = $pdo->prepare($req);
										$stmt->execute();
										$data = array(); //tableau pour stocker tous les résultats
										$data = [0]; //Le premier index de array() est 0, ainsi le 'numPoste' concordera à l'index array
										while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
											$data[] = $row;
											echo "<option value=".$row["numPoste"].">".$row["nomPoste"]."</option>";
										}
									}
									catch(Exception $e){
										print "Erreur ! ".$e->getMessage(). "<br/>";
									}
									?>
								</select>
		      	</div>
		      	<div class="modal-body"> <!--corps -->
 
								Numéro du poste: <input type="text" name="numPoste"> <?php echo $row["numPoste"]; ?> <br/>
								Nom du poste: <input type="text" name="nomPoste"> <?php echo $row["nomPoste"]; ?> <br/>
								<input type="submit" name="modifier" value="Modifier">
							</form>
						</p>    
	      		</div>
	      		<div class="modal-footer">
	        		<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
	      		</div>
	    	</div>
 
	  	</div>
	</div>

J'espérais utiliser un array() pour récupérer toutes les données de la requête (celle qui rempli la liste) afin de m'en resservir pour le remplissage des champs.

Le script appelé par le formulaire:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<?php
include "../include/connexion.php";
include "../Classe/posteSalarie.php";
if (isset($_POST["nomPoste"])) {
	$nom = $_POST["nomPoste"];
	$num = $_POST["numPoste"];
	$monposte = new posteSalarie($nom);
	$monposte->update($num);
	header("Location: ../test.php");
}
?>

Je précise que ce script fonctionne, puisqu'il me renvoie bien sur "test.php" par la suite.

Ainsi que le bout de la classe posteSalarie (sa fonction Update):

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
	public function update(){
		include "../include/connexion.php";
		$req = "UPDATE posteSalarie SET nomPoste=:nomPoste WHERE numPoste=:numPoste";
		$stmt = $pdo->prepare($req);
		if($stmt->execute(array(':numPoste'=>$this->_numPoste, ':nomPoste'=>$this->_nomPoste)) == TRUE){
			echo "Modification réussie!";
		} else {
			echo "Modification échouée...";
		}
		return true;
	}

Beaucoup de sujet sur internet parle de l'utilisation de javascript + ajax mais je suis persuadé qu'il existe une solution qui n'utilisa pas ces langages d'autant plus que je ne possède aucune connaissance en ajax et presque aucune en javascript :/

Je le rappelle, mon objectif est le suivant:
-Cliquer sur le bouton "modifier" afin d'ouvrir un "modal"
-choisir une option de la liste déroulante
-à partir de cette option, remplir le formulaire avec les données correspondant
-envoyer ces données via la méthode POST à script puis à fonction Update de la classe posteSalarie
-cette dernière mettra les données à jour dans ma base de données

Merci d'avance pour toute aide, n'hésitez pas à poser vos questions si je n'est pas suffisamment éclaircis un point!
Cordialement,
Skunka.

[Celira]

Tu arrives à ouvrir une modale sans javascript ? M'est avis que tu as du javascript caché, mais que tu n'es pas au courant Tu utilises quelque chose pour mettre ton site en forme ?

Navrée de te décevoir, mais si tu veux afficher des données sans rechargement de la page, il va falloir faire de l'AJAX, ou au moins du Javascript. PHp s'exécute client serveur, donc la seule façon de faire ton traitement en PHP est de recharger la page (ou d'envoyer un formulaire).

1ere solution : par AJAX : au changement de valeur de la liste (onchange), tu fais appel à un script PHP qui va te donner les données à mettre dans les champs et tu mets à jour les champs avec javascript.
2e solution : en JS pur : Au chargement de la page, tu as chargé toutes les valeurs possibles dans un tableau Javascript et au changement de valeur de la liste, tu va lire le tableau et tu mets à jour les champs du formulaire avec javascript.

[Skunka]

Tu arrives à ouvrir une modale sans javascript ? M'est avis que tu as du javascript caché, mais que tu n'es pas au courant Tu utilises quelque chose pour mettre ton site en forme ?

Pour être honnête, j'ai juste copier/coller un bout de code depuis W3Schools Et non, il n'y a pas encore de mise en forme, je souhaite d'abord avoir quelque chose de fonctionnel

1ere solution : par AJAX : au changement de valeur de la liste (onchange), tu fais appel à un script PHP qui va te donner les données à mettre dans les champs et tu mets à jour les champs avec javascript.
2e solution : en JS pur : Au chargement de la page, tu as chargé toutes les valeurs possibles dans un tableau Javascript et au changement de valeur de la liste, tu va lire le tableau et tu mets à jour les champs du formulaire avec javascript.

Très bien, j'ai choisis de travailler avec l'AJAX pour alléger le code la page en elle-même et pour m'y initier un peu! J'ai un peu farfouillé sur le forum, les FAQ et les tutos en rapport à mon problème. J'ai plus ou moins compris l'utilité d'AJAX (surtout dans mon cas) mais j'ai du mal à appréhender sa syntaxe et la manière de s'en servir.

Voici le bout d'AJAX que j'ai tapé suivit du script devant être appelé (dans lequel je ne sais pas réellement quoi mettre):

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
 
<script type="text/javascript">
	function Change(value){ //Appelle d'un script PHP permettant la récupération des données
		$.ajax({
			type: "POST",
			url: "posteSalarie_retrieve.php",
			data: ???,
			dataType: ???,
			success: function(num, nom){
				document.getElementsByTagName('numPoste').value = num;
				document.getElementsByTagName('nomPoste').value = nom;
			}
		})
	}	
 
	function callback(data){ //Permet l'affichage des données dans le formulaire
		alert(data);
	}
</script>

Je ne saisis pas l'utilisation de 'data' , 'datatype' (que mettre, pourquoi, dans quel but?) ni le fonctionnement de success (à mon avis, c'est la fonction "callback" qui s'effectue quand le serveur répond). Egalement, comment passer un paramètre ? Dois-je aussi construire un objet xhr pour utiliser ce code AJAX ?

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<?php 
include "../include/connexion.php";
include "../Classe/posteSalarie.php";
if (isset($_POST['numPoste'])) {
 
	$num = $_POST['numPoste'];
	include "../Classe/posteSalarie.php";
	$unPoste->retrieve($num);
	return $unPoste->getNumPoste(), $unPoste->getNomPoste();
} 
?>

J'ai simplement récupérer le script pour la création d'un poste salarié en l'adaptant un eu mais ne sachant pas sous quelle forme va arriver mon paramètre, je suis un peu perdu.

Evidemment si tu as une solution toute faite, je prend! Mais je serais plus intéressé par documentation assez concrète de l'AJAX utilisé dans un cas similaire, des posts de personnes ayant eu le même problème que moi ou une aide directe et personnalisé

Cordialement,
Skunka.

PS: si ce post n'est plus adapté à sa position dans le forum, merci de me l'indiqué que je puisse créer une nouvelle discussion dans le forum adéquate!

[Celira]

Je ne saisis pas l'utilisation de 'data' , 'datatype' (que mettre, pourquoi, dans quel but?) ni le fonctionnement de success (à mon avis, c'est la fonction "callback" qui s'effectue quand le serveur répond). Egalement, comment passer un paramètre ? Dois-je aussi construire un objet xhr pour utiliser ce code AJAX ?

Data : ce sont les données que tu envoies à ta page
DataType : c'est le format de ces données (genre ça peut être du JSON, ou un simple tableau)
Success : effectivement, c'est la fonction qui est exécutée quand le serveur répond avec un OK (tu peux gérer différent le cas où il y a une erreur)
xhr : si tu utilises un framework JS, il va fait le travail pour toi. En l'occurence, ta syntaxe est celle d'un appel par jQuery

Je pense qu'il vaudrait mieux voir la partie Ajax avec nos amis du forum Javascript et revenir ici régler la partie PHP lorsque l'appel ajax fonctionnera AJAX

[Skunka]

Bonjour,

j'ai remplacé "sucess" par "complete", ce qui correspond plus aux besoins ...
Je trouve la syntaxe jQuery assez agréable, elle est facilement lisible et explicite!

La modification est bien prise en compte mais il me reste un problème sur l'affichage. Dans le champ où est censé apparaître le nom du poste j'obtiens [object Object], ce qui doit être un problème du type retourné ou de la gestion des données retournés... Mais le problème est exposé dans le forum adéquate, cette discussion peut-être considérée comme résolue!
Encore merci des précisions que tu m'as apporté!

Cordialement,
Skunka.

[bonjourajax]

Bonjour

c'est surement a cause du dataType: ?