Utilisation de plusieurs fenêtres modales

**Regor** · 04/11/2015, 11h05

Bonjour

J'utilise l'ouverture d'une fenêtre modale pour afficher des infos.

Mais, je souhaite pourvoir à partir d'un bouton placé sur cette fenêtre modale pouvoir la fermer et pouvoir en ouvrir une seconde.

Merci de votre aide.

Bonne journée

Daniel

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
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<meta charset="UTF-8" />
		<title>Document ave fen^tre modale</title>
		<link rel="stylesheet" href="css/styles.css" />
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
	</head>
 
	<body>
				<a href="#openModal5" class="btn">Insérer</a>
				<div id="openModal5" class="modalDialog">
				<div>
					<a href="#close" title="Close" class="close">X</a>
            		<h2>Ma petite Modal Box bouton</h2>
            		<p>Voic ma modalbox!!!</p>
            		<p>Alors !!bien ou bien!!</p>
            	   	<a class="btn" href="#close">Essai !!!</a>
				</div>
				</div>
	</body>
</html>

**gazza** · 06/11/2015, 20h56

Envoyé par Regor

J'utilise l'ouverture d'une fenêtre modale pour afficher des infos.

Cela nécessite du 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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Document avec fenetre modale</title>
    <link rel="stylesheet" href="css/styles.css" />
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  </head>
 
  <body>
 
  <script language="javascript" type="text/javascript">
    function popitup(url) {
    newwindow=window.open(url,'name','height=600,width=600');
    if (window.focus) {newwindow.focus()}
    return false;
  }
  </script>
  <a href="#" onclick="return popitup('http://www.developpez.com')">Link to popup</a>
 
  </body>
</html>

**ABCIWEB** · 07/11/2015, 13h22

@gazza les fenêtres modales s'ouvrent normalement en superposition du document encours, pas dans une nouvelle fenêtre.

@Regor une fois le html de la fenêtre modale inséré il faut définir des comportements onclik sur l'élément que tu veux.

**Regor** · 07/11/2015, 16h29

Bonjour

Suite à vos messages, je vous apporte des infos complémentaires concernant mon problème d'affichage de mes fenêtres modales.

Le but de ma recherche, c'est après avoir lancer l’exécution de insertion.php, je souhaite avoir le message de réussite dans une autre fenêtre modale.

Merci de votre aide.

Daniel

1- Code bouton qui me lance le formulaire

Code :

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

1
2
3
4
5
6
7
8
9
10
 
<a href="#openModal1" class="btn">Insérer</a>
				<div id="openModal1" class="modalDialog">
				<div>
				<a href="#close" title="Close" class="close">X</a><h2>Formulaire de saisie</h2>
				<?php
                                include("formulaire1.php")
                                ?>
				</div>
				</div>

2- Code du formulaire

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
 
<html>
  <head>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="../../css/styles.css" />
    <title>insertion de données en PHP :: partie 1</title>
  </head>
<body>
<form name="insertion" action="insertion.php" method="POST">
  <table border="0" align="center" cellspacing="2" cellpadding="2">
    <tr align="center">
      <td>Nom</td>
      <td><input type="text" placeholder="Nom à saisir" name="nom" value="" required/></td>
    </tr>
    <tr align="center">
      <td>Prenom</td>
      <td><input type="text" name="prenom"></td>
    </tr>
    <tr align="center">
      <td>Téléphone</td>
      <td><input type="text" name="tel"></td>
    </tr>
    <tr align="center">
      <td>Fax</td>
      <td><input type="text" name="fax"></td>
    </tr>
    <tr align="center">
      <td colspan="2"><input type="submit" name="submit" value="insérer" class="btn"></td>
    </tr>
  </table>
</form>
</body>
</html>

3- Code insertion

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
 
<HTML>
	<head>
		<meta charset="UTF-8" />
		<title>Enregistrement</title>
	<head>
			<BODY>
				<?php
                                        include("connexion.php")
                                ?>
 
				<?php
                                // Récupération des champs
                                $nom = $_POST['nom'];
                                $prenom = $_POST['prenom'];
                                $tel = $_POST["tel"];
                                $fax = $_POST["fax"];
 
                                mysql_query("INSERT INTO t_client (id, nom, prenom, tel, fax) VALUES ('', '$nom', '$prenom', '$tel', '$fax') ");
                                mysql_close();
                                ?>
 
				<?php
                                // Affichage d'un message de réussite
                                echo "Le client $nom et $prenom vient d'être enregistré avec succès !";
                                ?>
			</BODY>
</HTML>

Utilisation de plusieurs fenêtres modales

HTML

Vue hybride

Discussions similaires

Partager

Partager