Comment passer un paramètre dans cette popup ?

Version imprimable

Voir 40 message(s) de cette discussion en une page

Code:

1
2
 $.post(url,{idPopup:id,popup:true},function(data){
       },"json");

la fonction de callback ne fait rien ?

Code:

1
2
$.post(url,{idPopup:id,popup:true},function(data){
alert( data['id']);       },"json");

La fonction alert() ne renvoie rien... Bizarre :aie:
Je ne sais pas trop comment, où et pourquoi cela bloque ...
Je suis un peu perdu pour tout vous dire :/
Code:

1 2 3 4 5 6 $("#passeJson").onload(function(){ id = $(this).find("span[name=id]").val(); url = $(this).attr("action"); $.post(url,{idPopup:id,popup:true},function(data){ alert( data['id']);},"json"); });
Code:

<form class="form-horizontal" action="produits.php" method="post" name="form_pdts" onsubmit="return valider()" id="passeJson">
Code:

1 2 3 4 5 6 7 <?php //Traitement popup if( $_POST['popup'] == true) { echo 'id : ',$_POST['idPopup']; } ?>
Code:

<span id="foo" name="id" ></span>

Merci d'avance

11/01/2014, 07h55
NoSmoking

Bonjour,

Citation:

Envoyé par drogba72

La fonction alert() ne renvoie rien... Bizarre :aie:

la fonction alert n'a jamais retourné de valeur si ce n'est undefined

Code:

alert( alert('Yes!'));

tu peux avantageusement la remplacer par un console.log( data['id']).

Bonjour,

J'ai testé les deux solutions rien n'y fait.

Je me suis demandé si ce n'était pas le onload() dans ce bout de code qui serait peut être pas la bonne formule en jQuery. Qu'en pensez vous ?
Code:

1 2 3 4 5 6 $("#passeJson").onload(function(){ id = $(this).find("span[name=id]").val(); url = $(this).attr("action"); $.post(url,{idPopup:id,popup:true},function(data){ console.log( data['id']);},"json"); });
Pour préciser :

Dans la console, voici ce qui s'affiche quand je clique sur le lien qui ouvre le popin :

Citation:

« none » ou URL attendu, mais « alpha( » trouvé. Erreur d'analyse de la valeur pour « filter ». Déclaration abandonnée.

11/01/2014, 14h27
NoSmoking

Ceci est un message d'erreur CSS sans influence sur le reste du script.
11/01/2014, 14h57
drogba72

Effectivement je n'avais pas vu la correspondance des couleurs.
Et en fait le javascript était désactivé dans la console :
Voici ce que j'ai trouvé :

L'API de la console de journalisation (console.log, console.info, console.warn, console.error) a été désactivée par un script sur cette page

Cela vous parle svp ?

En cherchant, j'ai trouvé que firebug pouvait poser problème, je l'ai désactivé et relancé et voici ce que j'ai maintenant lorsque je clique sur le lien pour ouvrir le popin :

- SyntaxError: missing : in conditional expression charisma.js:28
- TypeError: $(...).onload is not a function produits.php:325
- L'utilisation de « getPreventDefault() » est obsolète. Utiliser « defaultPrevented » à la place.

Par rapoprt à la deuxième erreur, le onload pose problème, c'est bien ça ?
13/01/2014, 08h28
SpaceFrog

Je reviens sur ma remarque précédente : la réponse reçue n'est pas formatée correctement !!

Code:

echo 'id : ',$_POST['idPopup'];

il manque les {}

ensuite en jquery il n'existe pas de methode onload() => c'est load()

Citation:

il manque les {}

Dans la ligne php mentionné, je vois pas vraiment où ces accolades iraient...

Afin d'avancer car je commence à me noyer, je vous joint le code ma page.
J'espère ne pas abuser de votre bonté en vous demandant où cela bloque t'il car toujours impossible de récupérer à l'ouverture de mon code l'id de ma ligne ...

Code:

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
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
<?php 
 
include('header.php'); 
 
//Traitement popup
//if( $_POST['popup'] == true)
//{
//	echo 'id : ',$_POST['idPopup'];
//}
//else // Traitement de la fenêtre principale
//{
 
	if( isset($_POST) && !empty($_POST['code']) && !empty($_POST['nom']))
	{
		extract($_POST);
 
		echo 'code ',$code,'<br>';
		echo 'nom ',$nom,'<br>';
		echo 'description ',$description,'<br>';
		echo 'statut ',$statut,'<br>';
		echo 'px_vente ',$px_vente,'<br>';
		echo 'contexte ',$contexte_popup_produit,'<br>';
		echo 'user ',$username,'<br>';
		echo 'user2 ',$_SESSION['Authentification']['username'],'<br>';
 
		if ($statut == 'Actif')
		{
			$insert_statut = 1;
		}
		else 
		{
			$insert_statut = 0;
		}
 
		$insert = $connection->prepare('INSERT INTO KS_PRODUITS VALUES(
		:id, :code, :statut, :descr, :px_vente, :px_achat, :user_creat, :date_creat, :user_modif, :date_modif, :stock, :nom)');
 
		try 
		{
	  		// On envois la requète
	  		$success = $insert->execute( array
	  										(
	  										'id'=>'',
	  										'code'=>$code,
	  										'statut'=>$insert_statut,
	  										'descr'=>$description,
	  										'px_vente'=>$px_vente,
	  										'px_achat'=>0,
	  										'user_creat'=>$username,
	  										'date_creat'=>date("Y-m-d"),
	  										'user_modif'=>'',
	  										'date_modif'=>'',
	  										'stock'=>0,
										    'nom'=>$nom
											 )
										);
 
	  		if( $success ) 
	  		{
	    		echo "Enregistrement réussi";
	  		} 
		} 
		catch( Exception $e )
		{
	  		echo 'Erreur de requète : ', $e->getMessage();
		}
 
	}
//}
 
?>
 
	<style>
		/* TEST */
        .voile-noir {
            position: fixed;
            display: none;
            left: 0;
            top: 0; 
            width: 100%;
            height: 100%;
            opacity: 0.75;
            background: gray; 
            z-index: 9999;
        }
        .popup-block{
            position: fixed;
            display: none;
            top: 50%;
            left: 50%;
            padding: 20px; 	
            z-index: 99999;
            font-size: 1em;
            background: #000;
            border: 20px solid #ddd;
            -webkit-box-shadow: 0px 0px 20px #000;
            -moz-box-shadow: 0px 0px 20px #000;
            box-shadow: 0px 0px 20px #000;
            -webkit-border-radius: 10px;
            -moz-border-radius: 10px;
            border-radius: 10px;
        }
        .popup p {
            padding: 5px 10px;
            margin: 5px 0;
        }
        .popup-btn-close {
            float: right; 
            margin: -55px -55px 0 0;
        }
    </style>
 
	<div>
		<a class="brand"> <span>Produits</span></a>
	</div>
 
	<div class="row-fluid sortable">	
		<div class="box span12">
			<div class="box-header well" data-original-title>
				<h2>Produits</h2>
				<div class="box-icon">
					<div class="btn btn-setting btn-round">
        				<a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="700px"><i class="icon-plus-sign"></i></a>
        			</div>
				</div>
			</div>
 
			<div class="box-content">
				<table class="table table-bordered table-striped table-condensed">
				  	<thead>
					  	<tr>
					  		<th style="display:none">Id </th>
					  	  	<th>Code</th>
						  	<th>Nom produit</th>
						  	<th>Prix de vente</th>
						  	<th>Statut</th> 
						  	<th>Actions</th>                                          
					  	</tr>
				  	</thead> 
 
				  	<tbody>
				   		<?php 
						// Récupération des données
						try 
						{
						  	// On envois la requète
						  	$select = $connection->query("SELECT * FROM KS_PRODUITS");
 
						  	// On indique que nous utiliserons les résultats en tant qu'objet
						  	$select->setFetchMode(PDO::FETCH_OBJ);
 
						  	// Nous traitons les résultats en boucle
						  	while( $enregistrement = $select->fetch() )
						  	{	
							    // Affichage des enregistrements
								echo '<tr>';
							  	// Affichage d'un des champs
							  	echo '<td style="display:none">', $enregistrement->PDT_ID, '</td>';
							  	echo '<td>', $enregistrement->PDT_CODE, '</td>';
							  	echo '<td>', $enregistrement->PDT_NOM, '</td>';
							  	echo '<td>', $enregistrement->PDT_PRIX_VENTE, ' €</td>';
 
							  	if ($enregistrement->PDT_ACTIF == '0')
							  	{
							  		echo '<td> Inactif </td>';
							  	}
							  	else 
							  	{
							  		echo '<td> Actif </td>';
							  	}     
 
							  	echo '<td class="center">';
							  		echo '<div class="btn btn-success">';
									echo '<a href="#" class="popup-light" data-popup-class="popup-block" data-popup-width="700px">';
										echo '<i class="icon-edit icon-white"></i>';            
									echo '</a>';
									echo '</div>';
									echo '<a class="btn btn-danger" href="#">';
										echo '<i class="icon-trash icon-white"></i>'; 
									echo '</a>';
								echo '</td>';   
								echo '</tr>';
						  	}
						} 
						catch ( Exception $e ) 
						{
						  	echo "Une erreur est survenue lors de la récupération des produits";
						}
 
 
					   	?>
 
				  	</tbody>
				</table>  
 
				<div class="pagination pagination-centered">
				  	<ul>
						<li><a href="#">Prev</a></li>
						<li class="active">
					  		<a href="#">1</a>
						</li>
						<li><a href="#">2</a></li>
						<li><a href="#">3</a></li>
						<li><a href="#">4</a></li>
						<li><a href="#">Next</a></li>
				  	</ul>
				</div>     
			</div>
		</div><!--/span-->
	</div><!--/row-->
 
 	<div class="popup-block"> 
        <div class="row-fluid sortable">
			<div class="box span12">
				<div class="box-header well" data-original-title>
					<h2><i class="icon-edit"></i> Produits</h2>
				</div>
				<div class="box-content">
					<form class="form-horizontal" action="produits.php" method="post" name="form_pdts" onsubmit="return valider()" id="passeJson">
						<fieldset>
							<?php 
							//Traitement popup
							//if( $_POST['popup'] == true)
							//{
								echo 'id : ',json_encode($_POST['popup']),'<br>';
								echo 'id : ',json_encode($_POST['idPopup']),'<br>';
							//}
							?>
 
							<span id="foo" name="id" ></span>
 
						  	<div class="control-group">
								<label class="control-label" for="focusedInput">Code</label>
								<div class="controls">
							  		<input class="input-xlarge focused" id="code" name="code" type="text" value="">
								</div>
						  	</div>
 
						  	<div class="control-group">
								<label class="control-label" for="focusedInput">Nom</label>
								<div class="controls">
							  		<input class="input-xlarge focused" id="nom" name="nom" type="text" value="">
								</div>
						  	</div>
 
						  	<div class="control-group">
							  	<label class="control-label" for="textarea2">Description</label>
							  	<div class="controls">
									<textarea class="cleditor" id="description" name="description" rows="3"></textarea>
							  	</div>
						  	</div>
 
						  	<div class="control-group">	
								<label class="control-label" for="selectError">Statut</label>
								<div class="controls">
							  		<select id="statut" name="statut" data-rel="chosen">
										<option>Actif</option>
										<option>Inactif</option>
							  		</select>
								</div>
					      	</div>	
 
					      	<div class="control-group">
								<label class="control-label" for="focusedInput">Prix de vente</label>
								<div class="controls">
							  		<input class="input-xlarge focused" id="px_vente" name="px_vente" type="text" value="">
								</div>
						  	</div>
 
						  	<div class="form-actions">
								<button type="submit" class="btn btn-primary" >Sauvegarder</button>
								<button class="btn">Annuler</button>
						  	</div>
					    </fieldset>
					</form>
				</div>
			</div><!--/span-->
		</div><!--/row-->
    </div>
 
 
	<script charset="utf-8" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
    <script>
        $(function(){
            $(".popup-light").click(function() {
                var obj = $(this),
                	popupligne = obj.parent().parents('tr:eq(0)').find('td:eq(0)').text(),
                    popupClass = obj.data("popupClass"),
                    popupWidth = obj.data("popupWidth"),
                    objPopup =  $('.' + popupClass);
 
                objPopup
                    .css("width", popupWidth)
                    .prepend('<img src="http://sohtanaka.developpez.com/tutoriels/javascript/creez-fenetre-modale-avec-css-et-jquery/fichiers/close_pop.png" class="popup-btn-close" title="Close Window" alt="Close" />')
                    .css({
                        // Si l'on regroupe les deux blocs CSS, le popup n'est pas bien positionné
                        // Le popup doit avoir sa taille définitive avant le calcul de outerHeight et de outerWidth
                        "margin-top":  -objPopup.outerHeight(true)/2,
                        "margin-left": -objPopup.outerWidth(true)/2
                    })
                    .fadeIn();
 
                $("<div/>", {
                    "class":"voile-noir",
                    "css":{
                        "filter":"alpha(opacity=80)"
                    }
                }).appendTo("body").fadeIn();
 
                $('#foo').html(popupligne);
 
                return false;
            });
 
            $("body").delegate(".popup-btn-close, .voile-noir", "click", function(){
                $('.voile-noir , .popup-block').fadeOut(function(){
                    $(".popup-btn-close, .voile-noir").remove();
                });
 
                return false;
            });
 
            $("#passeJson").load(function(){
            	id = $(this).find("span[name=id]").val();
                url = $(this).attr("action");
                $.post(url,{idPopup:id,popup:true},function(data){
                	console.log('youpi');},"json");
            });
        });
 
        function valider()
        {
       		elt=document.forms['form_pdts'].elements['code'];
        	if(elt.value = "") 
            {
        		alert("Saisissez un code");
          	  	return false;
        	}
 
        	elt=document.forms['form_pdts'].elements['nom'];
        	if(elt.value = "") 
            {
        		alert("Saisissez un nom de produit");
          	  	return false;
        	}
 
        	return true;
        }
 
 
    </script>
 
 
<?php include('footer.php'); ?>

Merci encore

14/01/2014, 08h40
SpaceFrog

Citation:

Dans la ligne php mentionné, je vois pas vraiment où ces accolades iraient...

to ajax attend un string json en retour

comme déja précisé un string json c'est :

Code:

'{"id":"valeur"}'

si id est un string

Code:

'{"id": 50}'

si id est un interger

Ton php ne retournant pas ce format de chaine ...

Désolé mais ce n'est toujours pas clair pour moi :oops: :oops:
Tu me parles de cette partie du code ?
Code:

1 2 3 4 5 6 $("#passeJson").load(function(){ id = $(this).find("span[name=id]").val(); url = $(this).attr("action"); $.post(url,{idPopup:id,popup:true},function(data){ console.log('youpi');},"json"); });
ou de celle ci ?

Code:

echo 'id : ',json_encode($_POST['popup']),'<br>';

S'il s'agit de la seconde partie, pensez vous que le code suivant devrait aller svp ?
Code:

1 2 $id = $_POST['popup'] echo '{"id": $id}';

14/01/2014, 09h27
SpaceFrog

A ton avis ... le retour de l'ajax est généré où ?
14/01/2014, 10h08
drogba72

Comme le but est de récupéré une variable php, j'imagine que le retour se fait en php :)

Je test cela ce soir et je vous tient au courant.
En espérant pouvoir enfin mettre résolu à ce sujet :)
Merci pour votre patience.

Alors hélas cela ne fonctionne toujours pas ...

Je me demande si la fonction de callback renvoie vraiment quelque chose ...

Comment puis je le vérifier svp ?
Par exemple : je regarde man console web et jamais il ne m'affiche youpi.
Pensez vous cela normal ?
Code:

1 2 3 4 5 6 $("#passeJson").load(function(){ id = $(this).find("span[name=id]").val(); url = $(this).attr("action"); $.post(url,{idPopup:id,popup:true},function(data){ console.log('youpi');}); });
De plus, cmment être sûr que "#passeJson" pointe bien vers l'id de ma balise form ?
Ne serait ce pas là mon vrai problème ?

Merci.

15/01/2014, 08h42
SpaceFrog

c'est quoi cet element ?

Code:

$("#passeJson")
15/01/2014, 13h00
drogba72

Il s'agit de l'id de mon formulaire :

Code:

<form class="form-horizontal" action="produits.php" method="post" name="form_pdts" onsubmit="return valider()" id="passeJson">
15/01/2014, 16h17
SpaceFrog

.load() sur un formulaire ???
15/01/2014, 16h30
drogba72

Pour rappel :

Je souhaite charger le détail de l'id (enregistrement sur lequel on a cliqué "modifier" dans le tableau) dans le formulaire se trouvant dans le popin.

Donc en faisant ça, je pensais que cela se ferais au chargement du formulaire, peut être que cela n'est pas bien pensé et qu'il faudrait le faire plutôt au chargement du popin.

Qu'en pensez vous ?
Comment procéderiez vous svp ?
15/01/2014, 16h36
SpaceFrog

load() sert:
- soit d'evenement de fin de chargement pour des images ou le window
- soit a charger du contenu externe à la page element

En l'occurence sur un form il n'y a pas d'evenement load de chargement

Il doit y avoir par contre un callback sur ton popin dans lequel tu pourras lancer ta fonction
15/01/2014, 17h07
drogba72

Citation:

Envoyé par SpaceFrog

load() sert:
- soit d'evenement de fin de chargement pour des images ou le window
- soit a charger du contenu externe à la page element

En l'occurence sur un form il n'y a pas d'evenement load de chargement

OK message bien reçu :)

Citation:

Envoyé par SpaceFrog

Il doit y avoir par contre un callback sur ton popin dans lequel tu pourras lancer ta fonction

Dois je positionner l'appel de la fonction callback dans mon popin ?
Pouvez vous être plus précis svp ?
15/01/2014, 17h17
SpaceFrog

regarde la doc du popin...
il doit y avoir un chapitre sur le callback ...

appelle ta fonction dans le callback du popin

Voir 40 message(s) de cette discussion en une page