Bonjour a tous
Je galère avec Jquery !! cette fois j'ai voulu tester l'envoie de variable POST vers un popup modale que j'ai trouver sur le net en utilisant php.
En faite l'idée c'est de saisir le nom dans mon input et de l'afficher dans un popup quand je clique sur le lien submit du formulaire.
Le problème c'est que quand je clique sur le liens, la validation ne s'effectue pas, j'ai le popup mais pas la variable $nom, mais quand je clique sur la touche Enter puis sur le liens, la variable s'affiche dans le popup.
pour plus d'info, voici mon formulaire:
mon pop.php :
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 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> <script type="text/javascript" src="js/forms.js"></script> <link rel="stylesheet" type="text/css" href="test.css" /> <script type="text/javascript" src="script.js"></script> <form method = "POST" name="form1" action=""> <input type="text" name="nom"/> <br> <a href="#?w=500" rel="popup_name" class="poplight" "javascript:document.forms['form1'].nom;document.forms['form1'].submit();">submit</a><br> </form> <?php include 'pop.php'; // le contenu de mon popup ?>
et finalement mon JS :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5 <div id="popup_name" class="popup_block"> <h2>Popup Test1</h2> <p>Votre nom est : <?php if (isset($_POST['nom'])) { $nom = $_POST['nom']; echo $nom; } ?></p> </div>
Si quelqu'un a une idée
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 $(document).ready(function() { //Lorsque vous cliquez sur un lien de la classe poplight et que le href commence par # $('a.poplight[href^=#]').click(function() { var popID = $(this).attr('rel'); //Trouver la pop-up correspondante var popURL = $(this).attr('href'); //Retrouver la largeur dans le href //Récupérer les variables depuis le lien var query= popURL.split('?'); var dim= query[1].split('&'); var popWidth = dim[0].split('=')[1]; //La première valeur du lien //Faire apparaitre la pop-up et ajouter le bouton de fermeture $('#' + popID).fadeIn().css({ 'width': Number(popWidth) }) .prepend(''); //Récupération du margin, qui permettra de centrer la fenêtre - on ajuste de 80px en conformité avec le CSS var popMargTop = ($('#' + popID).height() + 80) / 2; var popMargLeft = ($('#' + popID).width() + 80) / 2; //On affecte le margin $('#' + popID).css({ 'margin-top' : -popMargTop, 'margin-left' : -popMargLeft }); //Effet fade-in du fond opaque $('body').append(''); //Ajout du fond opaque noir //Apparition du fond - .css({'filter' : 'alpha(opacity=80)'}) pour corriger les bogues de IE $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); return false; }); //Fermeture de la pop-up et du fond $('a.close, #fade').live('click', function() { //Au clic sur le bouton ou sur le calque... $('#fade , .popup_block').fadeOut(function() { $('#fade, a.close').remove(); //...ils disparaissent ensemble }); return false; }); }); });
Merci !!!
Partager