Bonjour,
Je suis en train d’intégrer un site en structure MVC + index, et sur ma page contact j'ai un formulaire pour poser une question, très basique:
Ma vue :
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 <?php $title = 'Contact'; ?> <?php ob_start(); ?> <div class="contactMain"> <div class="contactBanner"><h1>Contact</h1></div> <div class="contactContent"> <div class="offset-lg-2 col-lg-3 shadow-lg contactOther"> <div class="otherWebsite"> <h3>Horaires d'ouverture <i class="far fa-clock"></i></h3> <p>Disponible du lundi au vendredi, de 9h à 13h et de 14h à 19h.</p> </div> <div class="phoneContact"> <h3>Téléphone <i class="fas fa-phone-square-alt"></i></h3> <p>04 78 37 88 15</p> </div> <div class="mailContact"> <h3>E-mail <i class="fas fa-at"></i></h3> <a href="mailto:name@email.com">Link text</a> </div> </div> <div class="offset-lg-1 col-lg-4 shadow-lg contactFormulary"> <h2>Poser votre question</h2> <div class="formulary "> <form method="POST" action="index.php?action=sendQuestion" id="questionForm" class="questionFormulary"> <label >Votre adresse mail:</label> <input name="mail" type="email" class="form-control" placeholder="name@example.com" required> <button class="btn btn-warning " type="submit">Envoyer</button> </form> <div class="formularyMessage"><span id="questionMessage"></span></div> </div> </div> </div> </div> <?php $content = ob_get_clean(); ?> <?php require('templateWithNav.php'); ?>
+ template:
Mon index:
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
69
70
71
72
73
74
75
76
77
78
79
80
81 <!DOCTYPE html> <html lang="fr"> <head> <meta charset="utf-8" /> <title><?= $title ?></title> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src="https://kit.fontawesome.com/76eb1105ab.js" crossorigin="anonymous"></script> <script src="public/js/jquery-3.4.1.min.js"></script> <link rel="stylesheet" href="dist/css/bootstrap.min"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link href="public/css/style.css" rel="stylesheet" /> <link rel="shortcut icon" type="image/jpg" href="public/images/logo.jpg"> </head> <body> <header > <div class="row templateMenu shadow-sm"> <div class="titleBlock col-md-3"> <a href="index.php?action=main"><img src="public/images/logo.jpg" alt="logo"></a> <h4><span>Raparations et dépannage électroménager sur </span><span class="city">Lyon</span>.</h4> </div> <div class="col-md-3 titleEmplacement" > <p id="navTitle"><i class="fas fa-phone-square-alt"></i> 04 78 37 88 15</p></div> <nav class="col-md-6"> <ul> <li><a href="index.php?action=main">Accueil</a></li> <li><a href="index.php?action=repair">Un dépannage ?</a></li> <li><a href="index.php?action=eco">Une démarche ECO</a></li> <li><a href="index.php?action=aboutUs">A propos de nous</a></li> <li class="contactButton"><a class="btn btn-warning " href="index.php?action=contact">Nous contacter</a></li> </ul> </nav> </div> </header> <div class="mainContent"> <?= $content?> </div> <footer > <div id="topBtn"><i class="far fa-arrow-alt-circle-up"></i></div> <div class="row templateFooter"> <div class="col-md-3 offset-md-2 mapFooter"> <ul> <li><img src="public/images/logo.jpg" alt="logo"></li> <li>E-menager</li> <li>75 cours Charlemagne</li> <li>69002 Lyon</li> <li><a href=""><i class="fab fa-facebook-square"></i></a><i class="fas fa-envelope-square"></i><i class="fab fa-twitter-square"></i></li> <li></li> </ul> </div> <div class="col-md-4 offset-md-1 contactFooter"> <ul> <li><h2>Contactez-nous pour un rendez-vous <span class="argumentFooter">RAPIDE</span></h2></li> <li class="phoneFooter"><strong><i class="fas fa-phone-alt"></i> 04 78 37 88 15</strong></li> <li>Disponible du lundi au samedi, de 9h à 13h et de 14h à 19h.</li> </ul> </div> </div> </footer> <script src="public/js/slider.js"></script> <script src="public/js/scroll.js"></script> <script src="public/js/form.js"></script> <script src="public/js/topBtn.js"></script> <script src="public/js/navTitle.js"></script> <script src="public/js/questionForm.js"></script> </body> </html>
Mon controller:
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 <?php require_once('controller/frontend.php'); $frontendController = new FrontendController(); try { if (isset($_GET['action'])) { if ($_GET['action'] == 'main') { $frontendController->main(); } elseif ($_GET['action'] == 'repair') { $frontendController->repairCon(); } elseif ($_GET['action'] == 'eco') { $frontendController->ecoCon(); } elseif ($_GET['action'] == 'aboutUs') { $frontendController->aboutUsCon(); } elseif ($_GET['action'] == 'contact') { $frontendController->contactCon(); } elseif ($_GET['action'] == 'sendMail') { if (!empty($_POST['test'])){ $frontendController->locateAsk($_POST['test']); } else { $frontendController->ecoCon(); } } elseif ($_GET['action'] == 'sendLocate') { if (!empty($_POST['locate'])){ $frontendController->locateAsk($_POST['locate']); } else { $frontendController->ecoCon(); } } elseif ($_GET['action'] == 'sendQuestion') { if (!empty($_POST['mail']) && !empty($_POST['questionContent'])){ $frontendController->sendQuestionCon($_POST['mail'],$_POST['questionContent']); } else { $frontendController->repairCon(); } } } else { $frontendController->main(); } } catch(Exception $e) { echo 'Exception reçue : '; }
Mon fichier 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 <?php require_once('model/chatManager.php'); require_once('model/locateManager.php'); class FrontendController { public function main() { require('view/frontend/mainView.php'); } public function repairCon() { require('view/frontend/repairView.php'); } public function ecoCon() { require('view/frontend/ecoView.php'); } public function aboutUsCon() { require('view/frontend/aboutUsView.php'); } public function contactCon() { require('view/frontend/contactView.php'); } public function locateAsk($locate) { if ($locate==13330 || ($locate>69000 && $locate <69161)) { $data = array("message"=>"Votre commune ".$locate." est éligible à nos services de réparations.", "price" => "Prix: 95 Eur (Forfait classique)", "conditions" => "Voir les conditions plus bas dans la page")/** whatever you're serializing **/; header('Content-Type: application/json'); echo json_encode($data);die; } elseif ($locate==69350 || ($locate>69161 && $locate <69860)) { $data = array("message"=>"Votre commune ".$locate." est éligible à nos services de réparations.", "price" => "Prix: 150 Eur (Forfait + 35 Kms)", "conditions" => "Voir les conditions plus bas dans la page")/** whatever you're serializing **/; header('Content-Type: application/json'); echo json_encode($data);die; } else{ $data = array("message"=>"Malheureusement votre commune ".$locate." n'est pas éligible à nos services.", "price" => "", "conditions" => "")/** whatever you're serializing **/; header('Content-Type: application/json'); echo json_encode($data);die; } } public function sendQuestionCon($mail,$question) { $data = array("Message"=>"Votre question a bien été envoyée à l'adresse".$mail.", nous vous répondrons dans les plus brefs délais.")/** whatever you're serializing **/; header('Content-Type: application/json'); echo json_encode($data);die; } }
Qui renvoi les donnés en Json
Code JavaScript : 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 $("#questionForm").submit(function(e){ e.preventDefault(); //empêcher une action par défaut var form_url = $(this).attr("action"); //récupérer l'URL du formulaire var form_method = $(this).attr("method"); //récupérer la méthode GET/POST du formulaire var form_data = $(this).serialize(); //Encoder les éléments du formulaire pour la soumission $.ajax({ url : form_url, type: form_method, data : form_data }).done(function(response){ console.log(response); $("#questionMessage").html(response.message); }); });
Partager