I would like to display an alert after sending an email as in this portfolio: https://www.mathieu-crevoulin.com/ after when you send mail you can see this alert : E-mail envoyé avec succès !
Merci pour votre message !
Une réponse vous sera apportée dans les plus brefs délais.
contact.php
<?php
use PHPMailer\PHPMailer\PHPMailer;
use PHPMailer\PHPMailer\Exception;
require 'PHPMailer/src/Exception.php';
require 'PHPMailer/src/PHPMailer.php';
require 'PHPMailer/src/SMTP.php';
if(isset($_POST["send"])){
$body = $_POST['message'];
$name = $_POST['name'];
$phone = $_POST['phone'];
$email = $_POST['email'];
$mail = new PHPMailer(true);
$mail->isSMTP();
$mail->Host = 'smtp.gmail.com';
$mail->SMTPAuth = true;
$mail->Username = 'mymail#mail.com';
$mail->Password = 'psw';
$mail->SMTPSecure = PHPMailer::ENCRYPTION_SMTPS; //Enable implicit TLS encryption
$mail->Port = 465;
$mail->setFrom('mymail#mail.com');
$mail->addAddress($_POST["email"]);
$mail->isHTML(true);
$mail->Subject = 'Projet web';
$mail->Body = "Message:" . $body . "<br>Phone number: " . $phone . "<br>Name: " . $name . "<br>Mail: " . $email;
$mail->send();
header("Location: http://127.0.0.1/test2/confirmmail.html#scrollspyHeading7");
}
index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons#1.9.1/font/bootstrap-icons.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css" integrity="sha512-doJrC/ocU8VGVRx3O9981+2aYUn3fuWVWvqLi1U+tA2MWVzsw+NVKq1PrENF03M+TYBP92PnYUlXFH1ZW0FpLw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://unpkg.com/aos#next/dist/aos.css" />
<script src="https://kit.fontawesome.com/1aca141b14.js" crossorigin="anonymous"></script>
<title>Portfolio</title>
</head>
<body>
<style>
#success-message, #error-message
{
display: none;
}
</style>
<nav class="navbar navbar-expand-lg fixed-top navbar-custom" style="padding: 1%;">
<div class="container">
<a class="navbar-brand" href="#">
<img src="logo.png" alt="Avatar Logo" style="width:40px;" class="rounded-pill">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-center" id="navbarNav">
<ul class="navbar-nav justify-content-center">
<li class="nav-item">
<a class="nav-link" href="#scrollspyHeading1">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#scrollspyHeading2">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#scrollspyHeading3">Compétences</a>
</li>
<!-- <li class="nav-item">
<a class="nav-link" href="#scrollspyHeading4">Portfolio</a>
</li> -->
<li class="nav-item">
<a class="nav-link" href="#scrollspyHeading6">À Propos</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#scrollspyHeading7">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- images/114-1144561_copyright-free-images-on-desk-with-laptop-and.jpg
images/269-2698560_high-resolution-laptop-desktop-wallpaper-hd.jpg
images/10705380.jpg -->
<div data-bs-spy="scroll" data-bs-target="#navbar-example2" data-bs-root-margin="0px 0px -40%" data-bs-smooth-scroll="true" class="scrollspy-example bg-light rounded-2" tabindex="0">
<div id="carouselExampleInterval" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-inner" id="scrollspyHeading1">
<div class="carousel-item active " data-bs-interval="3000">
<img src="images/888777555.jpeg" class="d-block w-100" alt="...">
<div class="carousel-caption d-flex flex-column justify-content-center h-100" style="top: 0">
<h2 class="in-left">Développeur indépendant</h2>
<p class="in-left">SAVINOV Denis</p>
</div>
</div>
</div>
<div class="col-10 footertext" data-aos="fade-right">
<h5 class="text-end"><strong>Intégration Web</strong></h5>
<p class="text-end grisclaire">Des intégrations (X)HTML / CSS respectueuses des
standards du Web.
</p>
</div>
<div class="col-2" data-aos="fade-right">
<i class="fa-solid fa-code fa-2xl"></i>
</div>
<div class="col-10 footertext" data-aos="fade-right">
<h5 class="text-end"><strong>Développements spécifiques</strong></h5>
<p class="text-end grisclaire">Des outils adaptés à votre coeur de métier,
applications & solutions personnalisées.</p>
</div>
<div class="col-2" data-aos="fade-right">
<i class="fa-solid fa-wrench fa-2xl"></i>
</div>
<div class="col-10 footertext" data-aos="fade-right">
<h5 class="text-end"><strong>Référencement naturel</strong></h5>
<p class="text-end grisclaire">Affichage sémantique des informations,
des pages propres pour un référencement optimal.</p>
</div>
<div class="col-2" data-aos="fade-right">
<i class="img-fluid material-icons" style="width: 100%;"><img class="img-fluid w-100" src="images/5902216.png" alt="" style="width: 100%;"></i>
</div>
</div>
</div>
<div class="col-md-4 mb-3 mb-md-0 row align-items-center">
<div class="row align-items-center" data-aos="fade-up">
<div class="col">
<img src="images/index1.jpeg" class="d-block w-100 d-none d-lg-block" alt="...">
</div>
</div>
</div>
<div class="col-md-4 mb-3 mb-md-0">
<div class="row align-items-center">
<div class="col-2" data-aos="fade-left">
<i class="img-fluid material-icons" style="width: 100%;"><img src="images/kisspng-icon-design-web-development-responsive-web-design-black-brush-5afd4d493dd9d2.7237427015265498332534.png" alt="" style="width: 100%;"></i>
</div>
<div class="col-10 footertext" data-aos="fade-left">
<h5 class="text-start"><strong>Conception graphique & Webdesign</strong></h5>
<p class="text-start grisclaire">Logos, templates Web, plaquettes publicitaires,
cartes de visite, newsletters...</p>
</div>
<div class="col-2" data-aos="fade-left">
<i class="img-fluid material-icons" style="width: 100%;"><img src="images/3938579.png" alt="" style="width: 100%;"></i>
</div>
<div class="col-10 footertext" data-aos="fade-left">
<h5 class="text-start"><strong>Dynamisme des pages</strong></h5>
<p class="text-start grisclaire">Des animations de contenu non intrusives
pour embellir votre projet.</p>
</div>
<div class="col-2" data-aos="fade-left">
<i class="img-fluid material-icons" style="width: 100%;"><img src="images/2739572-200.png" alt="" style="width: 100%;"></i>
</div>
<div class="col-10 footertext" data-aos="fade-left">
<h5 class="text-start"><strong>Interface d'administration</strong></h5>
<p class="text-start grisclaire">Outils spécifiques au bon fonctionnement
de votre entreprise.</p>
</div>
<div class="col-2" data-aos="fade-left">
<i class="img-fluid material-icons" style="width: 100%;"><img src="images/1027666.png" alt="" style="width: 100%;"></i>
</div>
<div class="col-10 footertext" data-aos="fade-left">
<h5 class="text-start"><strong>Responsive design</strong></h5>
<p class="text-start grisclaire">Compatible tous supports, tablette & application
mobile.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<div class="imagesjolie">
<div class="parallax-header" style=" background: #000;
background: linear-gradient(
rgba(0, 0, 0, 0.3),
rgba(0, 0, 0, 0.8)
),
url(1393785.jpg);
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;">
<div class="container d-flex align-items-center justify-content-center" style="height: 200px;">
<div class="header-content">
<h1 class="text-center imagebluranimation" style="color: white;">Développement Web Responsive
</h1>
<h4 class="text-center imagebluranimation" style="color: white;">Compatible Mobile, Tablettes &
P.C</h4>
</div>
</div>
</div>
</div>
<div class="imagesjolie">
<div class="parallax-header" style=" background: #000;
background: linear-gradient(
rgba(0, 0, 0, 0.3),
rgba(0, 0, 0, 0.8)
),
url(521120.jpg);
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;">
<div class="container d-flex align-items-center justify-content-center" style="height: 200px;">
<div class="header-content">
<h1 class="text-center imagebluranimation" style="color: white;"> PME, associations ou
particuliers,
je réponds à vos besoins en développement web </h1>
</div>
</div>
</div>
</div>
</br>
<div class="container text-center" id="scrollspyHeading6" style="padding-bottom: 3%;">
<h1 style="padding-top: 4%;" data-aos="fade-down">
<g>À PROPOS</g>
</h1>
<h4 style="color: rgb(117, 111, 111);" data-aos="fade-down">Je suis développeur web freelance et j'aime ça !
</h4>
<div class="row gx-4 gx-lg-5">
<div class="col-md-4 mb-3 mb-md-0" data-aos="fade-right">
<h4 class="text-start">Un développeur web passionné !</h4>
<p class="text-start grisclaire">Ma passion pour le développement web commence en 2003 et m'a
demandé un
changement
radical de cursus
afin de pouvoir pleinement l'exploiter.</br> </br>
Dès lors, je mis tout en oeuvre pour percer dans cette voie, tout en prenant du plaisir sur les
divers projets développés.</br> </br>
En Mai 2009, je décide de devenir développeur web indépendant après plusieurs postes en tant que
développeur web « full-stack » réussis, qui me conforteront dans cette idée afin de toucher un
plus
large panel de domaines d'activités, voir du pays et conquérir le monde !</p>
</div>
<div class="col-md-4 mb-3 mb-md-0 row align-items-center" data-aos="fade-up">
<div class="row align-items-center">
<div class="col">
<img src="images/index1.jpeg" class="d-block w-100 d-none d-lg-block" alt="...">
</div>
</div>
</div>
<div class="col-md-4 mb-3 mb-md-0" data-aos="fade-left">
<h4 class="text-start">Expérience en développement</h4>
<p class="text-start grisclaire"> Mon expérience acquise au fil des projets me permet de mieux
comprendre les
attentes d'un client
et de
répondre précisement au besoin demandé en fonction du domaine d'activité.</p>
<p class="text-start grisclaire">Du site vitrine au projet plus complexe, je vous propose une
expertise et un
développement web qui
correspond à vos attentes & à vos besoins.</p>
<h3 class="text-start">Un tarif adapté à votre projet</h3>
<p class="text-start grisclaire"> Travaillant régulièrement avec des PME, associations ou
particuliers, je vous
propose des solutions
à
votre portée & adaptée à votre budget.</p>
</div>
</div>
</div>
<div class="imagesjolie">
<div class="parallax-header" style=" background: #000;
background: linear-gradient(
rgba(0, 0, 0, 0.3),
rgba(0, 0, 0, 0.8)
),
url(1393769.jpg);
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;">
<div class="container d-flex align-items-center justify-content-center" style="height: 200px;">
<div class="header-content">
<h1 class="text-center imagebluranimation" style="color: white;"> Un interlocuteur unique pour
un site internet
réussi
!
</h1>
</div>
</div>
</div>
</div>
<div class="container text-center" id="scrollspyHeading7">
<h1 style="padding-top: 4%;" data-aos="fade-down">
<b>CONTACTEZ-MOI</b>
</h1>
<h3 class="footertext" style="background-color: rgb(245, 245, 245);padding: 1%;" data-aos="fade-down"><b>Une
idée ? Un projet ? N'hésitez pas à
demander un devis !
[GRATUIT]</b></h3>
<div class="row align-items-center" style="padding: 3%;">
<div class="col-md-4 mb-3 mb-md-0 text-start">
<div class="row">
<div class="col">
<div class="row" data-aos="fade-right">
<div class="col-2 align-self-center">
<i class="bi bi-geo-alt-fill w-100"></i>
</div>
<div class="col-10" style="padding-top: 3%; padding-bottom: 3px; border-bottom: 1px solid rgb(235, 232, 232);">
<h6><b>ADRESSE</b></h6>
<p>45, allée des Grives 83390 Cuers</p>
</div>
<div class="col-2 align-self-center">
<i class="bi bi-whatsapp"></i>
</div>
<div class="col-10" style="padding-top: 3%; padding-bottom: 3px; border-bottom: 1px solid rgb(235, 232, 232);">
<h6><b>Téléphone</b></h6>
<p>(+33) 6.15.42.10.45</p>
</div>
<div class="col-2 align-self-center">
<i class="bi bi-envelope-fill"></i>
</div>
<div class="col-10" style="padding-top: 3%; border-bottom: 1px solid rgb(235, 232, 232);">
<h6><b>E-mail</b></h6>
<p>contact#mcrevoulin.com</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-4 mb-3 mb-md-0">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d84484.16954510748!2d7.692039647318505!3d48.56905316137844!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4796c8495e18b2c1%3A0x971a483118e7241f!2sStrasbourg!5e0!3m2!1sen!2sfr!4v1659196020939!5m2!1sen!2sfr" width="300" height="400" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade" data-aos="fade-up"></iframe>
<!-- <iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d316530.06898113067!2d38.75890546037433!3d51.69843674434513!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x413b2f5ce874e813%3A0x48d94c0efba762bd!2sWoronesch%2C%20Oblast%20Woronesch%2C%20Russland!5e0!3m2!1sde!2sde!4v1658941426253!5m2!1sde!2sde"
width="300" height="200" style="border:0;" allowfullscreen="" loading="lazy"
referrerpolicy="no-referrer-when-downgrade"></iframe> -->
</div>
<div class="col-md-4 mb-3 mb-md-0" data-aos="fade-left">
<form id="contactForm" action="contact.php" method="POST">
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1"><i class="bi bi-person-fill"></i></span>
<input type="text" id="name" name="name" class="form-control" placeholder="Nom Prénom"
aria-label="Nom Prénom" aria-describedby="basic-addon2" required>
</div>
<!-- Email address input -->
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">#</span>
<input type="text" id="email" name="email" class="form-control" placeholder="Email"
aria-label="email" aria-describedby="basic-addon1" required>
</div>
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1"><i class="bi bi-telephone-fill"></i></span>
<input type="text" id="phone" name="phone" class="form-control" placeholder="Téléphone"
aria-describedby="basic-addon2" required>
</div>
<!-- Message input -->
<div class="mb-3">
<textarea class="form-control" id="exampleFormControlTextarea1" rows="3"
placeholder="Decrivez le plus possible votre projet" name="message" required></textarea>
</div>
<!-- Form submit button -->
<div class="d-grid">
<button class="btn btn-primary btn-lg" name="send" type="submit">Submit</button>
</div>
</form>
</div>
</div>
</div>
</div>
<footer style="background-color: #2c2c2c;">
<div class="container" style="padding: 5%;">
<div class="row justify-content-between gx-4 gx-lg-5">
<div class="col-md-4 mb-3 mb-md-0" data-aos="fade-right">
<h6 style="color: white;"> Développeur Informatique Indépendant</h6>
<p class="grisclaire">Développeur Web front & back-end & Webdesigner freelance, je suis à votre
disposition pour répondre à
tout type
de projets de création de sites internet, de développement spécifique ou d'applications web.
</p>
<p class="grisclaire">Passionné par les technologies liées au Web, je mets mes compétences au
service de vos besoins dans
divers
domaines.</p>
</div>
<div class="col-md-4 mb-3 mb-md-0 " data-aos="fade-left">
<h6 style="color: white;"> Mathieu CRÉVOULIN</h6></br>
<a class="grisclaire footertext" href="https://goo.gl/maps/XD9CrQDL9WXZWrWV6" style="margin-bottom: 0; text-decoration: none;"> <i class="bi bi-geo-alt"> 45, allée
des Grives 83390 Cuers </i></a></br>
<a href="https://api.whatsapp.com/send?phone=33651289271" class="grisclaire footertext" style="margin-bottom: 0; text-decoration: none;"> <i class="bi bi-whatsapp"></i> (+33)
6.15.42.10.45</a>
<p class="grisclaire footertext" style="margin-bottom: 0;"> <i class="bi bi-envelope-fill"></i>
contact#mcrevoulin.com </p>
<p class="grisclaire footertext" style="margin-bottom: 0;"><i class="bi bi-link"></i>
www.mathieu-crevoulin.com</p>
</div>
</div>
</footer>
<script src="https://unpkg.com/aos#next/dist/aos.js"></script>
<script>
AOS.init();
$(document).ready(function(){
$('#contactForm').submit(function(e){
e.preventDefault();
const $this = $(this);
// disable submit button
const $button = $(this).find('button[type="submit"]').text('Submit...').attr('disabled', 'disabled');
// send message
$.ajax({
type: 'POST',
url: 'contact.php',
data: $this.serialize(),
success: function(data){
alert("E-mail envoyé avec succès ! Merci pour votre message ! Une réponse vous sera apportée dans les plus brefs délais.");
$this[0].reset(); // reset form
},
error: function(jqXHR, textStatus, errorThrown){
alert('An error occurred. Please try again')
},
complete: function(jqXHR, textStatus){
// enable submit button
$button.text('Submit').removeAttr('disabled');
}
})
})
});
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="js/javascript.js"></script>
<script src="https://cdn.jsdelivr.net/npm/#popperjs/core#2.11.5/dist/umd/popper.min.js" integrity="sha384-Xe+8cL9oJa6tN/veChSP7q+mnSPaj5Bcu9mPX5F5xIGE0DVittaqT5lorf0EI7Vk" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap#5.2.0/dist/js/bootstrap.min.js" integrity="sha384-ODmDIVzN+pFdexxHEHFBQH3/9/vQ9uori45z4JjnFsRydbmQbmL5t1tQ0culUzyK" crossorigin="anonymous"></script>
</body>
</html>
I would like to do the same so that after sending an email there is an alert that appears as in the example I showed (without loading the page or sending to a new page). I tried to create a new page with an alert but I wish its done like in the example I showed. How should I do?
You can achieve this using AJAX. Try this
contact.php file
if(isset($_POST["send"])){
$body = $_POST['message'];
$name = $_POST['name'];
$phone = $_POST['phone'];
$email = $_POST['email'];
$mail = new PHPMailer(true);
$mail->isSMTP();
$mail->Host = 'smtp.gmail.com';
$mail->SMTPAuth = true;
$mail->Username = 'mymail#mail.com';
$mail->Password = 'psw';
$mail->SMTPSecure = PHPMailer::ENCRYPTION_SMTPS; //Enable implicit TLS encryption
$mail->Port = 465;
$mail->setFrom('mymail#mail.com');
$mail->addAddress($_POST["email"]);
$mail->isHTML(true);
$mail->Subject = 'Projet web';
$mail->Body = "Message:" . $body . "<br>Phone number: " . $phone . "<br>Name: " . $name . "<br>Mail: " . $email;
$mail->send();
// header("Location: http://127.0.0.1/test2/confirmmail.html#scrollspyHeading7");
echo 'sent';
exit;
}
index.php
<div class="col-md-4 mb-3 mb-md-0" data-aos="fade-left">
<form id="contactForm" action="contact.php" method="POST">
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1"><i class="bi bi-person-fill"></i></span>
<input type="text" id="name" name="name" class="form-control" placeholder="Nom Prénom"
aria-label="Nom Prénom" aria-describedby="basic-addon2" required>
</div>
<!-- Email address input -->
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1">#</span>
<input type="text" id="email" name="email" class="form-control" placeholder="Email"
aria-label="email" aria-describedby="basic-addon1" required>
</div>
<div class="input-group mb-3">
<span class="input-group-text" id="basic-addon1"><i class="bi bi-telephone-fill"></i></span>
<input type="text" id="phone" name="phone" class="form-control" placeholder="Téléphone"
aria-describedby="basic-addon2" required>
</div>
<!-- Message input -->
<div class="mb-3">
<textarea class="form-control" id="exampleFormControlTextarea1" rows="3"
placeholder="Decrivez le plus possible votre projet" name="message" required></textarea>
</div>
<!-- Form submit button -->
<div class="d-grid">
<button class="btn btn-primary btn-lg" name="send" type="submit">Submit</button>
</div>
</form>
</div>
Add this before the closing body tag. For submitting the form asynchronously
<script>
$(document).ready(function(){
$('#contactForm').submit(function(e){
e.preventDefault();
const $this = $(this);
// disable submit button
const $button = $(this).find('button[type="submit"]').text('Submit...').attr('disabled', 'disabled');
// send message
$.ajax({
type: 'POST',
url: 'contact.php',
data: $this.serialize(),
success: function(data){
alert("E-mail envoyé avec succès ! Merci pour votre message ! Une réponse vous sera apportée dans les plus brefs délais.");
$this[0].reset(); // reset form
},
error: function(jqXHR, textStatus, errorThrown){
alert('An error occurred. Please try again')
},
complete: function(jqXHR, textStatus){
// enable submit button
$button.text('Submit').removeAttr('disabled');
}
})
})
})
</script>
Related
I am trying to wrap a div around every two elements I am looping with php but I am not getting the desired output.
Below my PHP code:
<?
$diensten = "SELECT * FROM snm_content WHERE catid = 9 AND state = 1 ORDER BY ordering";
$dienstencon = $conn->query($diensten);
$tel = 1;
while($diensten = $dienstencon->fetch_assoc()){
if (strlen($diensten['introtext']) > 100){
$shortstr = substr($diensten['introtext'], 0, 100) . '...';
}else{
$shortstr = $diensten['introtext'];
}
//Wrap de slide in deze div elke 2 keer binnen de loop
if($tel % 2 == 1){
$dienstenslider .= '<div class="col-lg-12 col-md-12 col-sm-12">';
}
$dienstenslider .= '
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>'.$diensten['title'].'</p>
<p class="ser-cont">
'.strip_tags($shortstr).'
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>';
if(($tel % 2) == 0){
$dienstenslider .= '</div> <div class="col-lg-12 col-md-12 col-sm-12">';
}
$tel++;
}
if(($tel % 2) != 0){
$dienstenslider .= '</div>';
}
echo $dienstenslider;
?>
And this is the output that I am getting from that code:
<div class="box ser-box large-width-box-w1 box-h1">
<div id="service-owl" class="owl-carousel owl-theme" style="opacity: 1; display: block;">
<div class="owl-wrapper-outer autoHeight" style="height: 272px;">
<div class="owl-wrapper" style="width: 3120px; left: 0px; display: block; transition: all 1000ms ease; transform: translate3d(0px, 0px, 0px);">
<div class="owl-item" style="width: 780px;">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>Begeleiding Individueel</p>
<p class="ser-cont">
Begeleiding thuis is praktische hulp aan mensen die door problemen de grip op hun dagelijks leven...
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>Verpleging</p>
<p class="ser-cont">
Thuis is de plek waar u het liefst wilt zijn. Daar voelt u zich het meest op uw gemak. In uw eige...
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>
</div>
</div>
<div class="owl-item" style="width: 780px;">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>Hulp bij het huishouden</p>
<p class="ser-cont">
Als u door welke reden dan ook niet meer zelfstandig uw huishouden kunt voeren en hierbij (tijdel...
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>Persoonlijke verzorging</p>
<p class="ser-cont">
Heeft u moeite met opstaan? Kunt u zichzelf steeds moeilijker verzorgen? Of geldt dit misschien v...
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>
</div>
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>Hulp bij Dementie</p>
<p class="ser-cont">
in ontwikkeling
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>
</div>
<!-- Slider -->
</div>
</div>
</div>
</div>
</div>
<div class="owl-controls clickable">
<div class="owl-pagination">
<div class="owl-page active"><span class=""></span></div>
<div class="owl-page"><span class=""></span></div>
</div>
</div>
</div>
</div>
While this is what I want:
<div class="box ser-box large-width-box-w1 box-h1">
<div id="service-owl" class="owl-carousel owl-theme" style="opacity: 1; display: block;">
<div class="owl-wrapper-outer autoHeight" style="height: 297px;">
<div class="owl-wrapper" style="width: 3120px; left: 0px; display: block; transform: translate3d(-780px, 0px, 0px); transition: all 800ms ease;">
<div class="owl-item" style="width: 780px;">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>Begeleiding Individueel</p>
<p class="ser-cont">
Begeleiding thuis is praktische hulp aan mensen die door problemen de grip op hun dagelijks leven...
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>Verpleging</p>
<p class="ser-cont">
Thuis is de plek waar u het liefst wilt zijn. Daar voelt u zich het meest op uw gemak. In uw eige...
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>
</div>
</div>
<div class="owl-item" style="width: 780px;">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>Persoonlijke verzorging</p>
<p class="ser-cont">
Heeft u moeite met opstaan? Kunt u zichzelf steeds moeilijker verzorgen? Of geldt dit misschien v...
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>
<div class="col-lg-6 col-md-6 col-sm-12">
<div class="serv-item pull-left">
<p class="ser-tit"><i class="pe-7s-notebook"></i>Hulp bij Dementie</p>
<p class="ser-cont">
in ontwikkeling
</p>
Lees meer<i class="fa fa-angle-right"></i>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Slider -->
<div class="owl-controls clickable">
<div class="owl-pagination">
<div class="owl-page"><span class=""></span></div>
<div class="owl-page active"><span class=""></span></div>
</div>
</div>
</div>
</div>
How can I get that output? Even when there are an uneven amount of items being loaded?
This is what I am currently working on (the slider is not working without problems as you can see).
This is almost a copy of the website where the slider does work (the reason I am not copying that is because it is outdated/messy code).
The approach with modulo is correct, but you are writing duplicate opening tags.
the first usage is okay:
//Wrap de slide in deze div elke 2 keer binnen de loop
if($tel % 2 == 1){
$dienstenslider .= '<div class="col-lg-12 col-md-12 col-sm-12">';
}
The second usage you should only put a closing tag:
if(($tel % 2) == 0){
// the opening tag will be written in the first usage above. writing it here too results in duplicate opening tags
// $dienstenslider .= '</div><div class="col-lg-12 col-md-12 col-sm-12">';
$dienstenslider .= '</div>';
}
Then you have another usage outside your while loop. This looks okay too.
if(($tel % 2) != 0){
$dienstenslider .= '</div>';
}
this is the html code of the slideshow:
<div class="bg-faded p-4 my-4">
<hr class="divider">
<h2 class="text-center text-lg text-uppercase my-0"><strong>Notícias</strong></h2>
<hr class="divider">
<div class="bg-faded p-4 my-4">
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<div class="carousel-inner" role="listbox">
<div class="carousel-item active">
<img class="img-fluid float-left mr-4 d-none d-lg-block" src="img/noticia1.jpg" alt="" style="max-width: 250px; max-height: 150px;">
<p>A Fidelidade brilhou na Web Summit 2017 com o programa Protechting by Fosun & Fidelidade e atraiu cerca de 180 novas candidaturas de startups! Um número promissor que confirma o prestígio associado a esta iniciativa, bem como o nosso compromisso com o empreendedorismo, a inovação tecnológica e o desenvolvimento do País. Obrigado a todos que estiveram connosco nestes dias!</p>
</div>
<div class="carousel-item">
<img class="img-fluid float-left mr-4 d-none d-lg-block" src="img/noticia2.png" alt="" style="max-width: 250px; max-height: 150px;">
<p>Agora já não precisa de sair de casa para ir ao médico. Vá por telefone ou vídeo.</p>
</div>
</div>
</div>
</div>
</div>
and i tried to use sql fields in this slideshow:
<div class="bg-faded p-4 my-4">
<!-- Image Carousel -->
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<div class="carousel-inner" role="listbox">
<?php
require_once "conexao.php";
$conexao = conexao_db();
$sql = mysqli_query($conexao, "SELECT * FROM noticias");
$row = mysqli_num_rows($sql);
if ($row>0) {
while ($registo = mysqli_fetch_array($sql)) {
extract($registo);
echo "<div class='carousel-item active'>
<img class='img-fluid float-left mr-4 d-none d-lg-block' src='img/".$no_img."' alt='' style='max-width: 250px; max-height: 150px;'>
<p>".$no_noticia."</p>
</div>";
}
}
?>
</div>
</div>
</div>
but how you see, the first slide of the slideshow needs to have the "active" in the div class, but the rest do not. how do i do this using php?
You can use a variable to control if it is the first slide or not:
<div class="bg-faded p-4 my-4">
<!-- Image Carousel -->
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<div class="carousel-inner" role="listbox">
<?php
require_once "conexao.php";
$conexao = conexao_db();
$sql = mysqli_query($conexao, "SELECT * FROM noticias");
$row = mysqli_num_rows($sql);
if ($row>0) {
$isFirstSlide = true;
while ($registo = mysqli_fetch_array($sql)) {
extract($registo);
$class = '';
if($isFirstSlide){
$class = ' active';
}
echo "<div class='carousel-item".$class."'>
<img class='img-fluid float-left mr-4 d-none d-lg-block' src='img/".$no_img."' alt='' style='max-width: 250px; max-height: 150px;'>
<p>".$no_noticia."</p>
</div>";
$isFirstSlide = false;
}
}
?>
</div>
</div>
</div>
I have searched on this forum for a solution and other places as well. But I can't find the problem with the code I wrote. The php file called Email_Service.php looks like this:
<?php
////////////////////////////////////////
// [Email-Service] v3.5 /
//////////////////////////////////////
//Email Service Class
class EmailService {
//Properties
private $email_basis;
private $type;
//Constructor
function __construct($type) {
echo '[EmailService] type: ' . $type;
}
//Send Email function with passed on arrays from test_pagina.php
function versturen($emailInfo, $klantInfo) {
//Email info
$email_van = $emailInfo['email_van'];
$email_naar = $emailInfo['email_naar'];
$email_onderwerp = $emailInfo['email_onderwerp'];
//Controleer of het opgegeven email adres geldig is en geen rare tekens bevat
$pattern = "/^[_a-z0-9-]+(\.[_a-z0-9-]+)*#[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/i";
if (preg_match($pattern, trim(strip_tags($emailInfo['email_van'])))) {
$cleanedFrom = trim(strip_tags($emailInfo['email_van']));
} else {
return "The email address you entered was invalid. Please try again!";
}
//Hier word de email_template geopend voor elke type.
//Zorg vraag formulier
if ($emailInfo['type'] == 'zorgvraag') {
//$email_basis = file_get_contents(base_url() . 'include/email_template_zorgvraag.txt'); //(LOKAAL)
//file_get_contents(base_url() . "assets/email_template.txt"); //(ONLINE)
} else if ($emailInfo['type'] == 'aanmelden') {
//$email_basis = file_get_contents(base_url() . 'mail_php/email_template_aanmeldformulier.txt'); //(LOKAAL)
}
//Personaliseer de email door de velden te vervangen met de ingevulde parameters
$email_basis = str_replace("f_voornaam", $klantInfo['voornaam'], $email_basis);
$email_basis = str_replace("f_achternaam", $klantInfo['achternaam'], $email_basis);
$email_basis = str_replace("f_telefoon", $klantInfo['telefoon'], $email_basis);
$email_basis = str_replace("f_email", $klantInfo['email_van'], $email_basis);
$email_basis = str_replace("f_bericht", $klantInfo['$bericht'], $email_basis);
$email_basis = str_replace("f_locatie", $klantInfo['$locatie'], $email_basis);
//Genereer headers
$headers = "From: " . $cleanedFrom . "\r\n";
$headers .= "Reply-To: ". strip_tags($_POST['f_email']) . "\r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
//Hier word de mail verstuurd als alles goed is
if (mail($emailInfo['email_naar'], $emailInfo['email_onderwerp'], $email_basis, $headers)) {
//CC
mail('info#yourdomain.nl', $emailInfo['email_onderwerp'], $email_basis, $headers);
} else {
echo 'Er is iets fout gegaan. Probeer het later nog een keer!';
die();
}
}
}
?>
It's called from another php file called test_pagina.php which looks like this:
<?php
include 'https://yourdomain.nl/assets/Email_Service.php'; //ONLINE
//require base_url() . 'assets/Email_Service.php'; //LOKAAL
//Haal gemeeente uit de adres balk
$url = "https://".$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
$url_onderdeel = explode('/', $url);
$gemeente = $url_onderdeel[4];
$gemeenteHoofdletter = ucfirst($gemeente);
//Email parameters
$email_van; $email_naar; $email_onderwerp = "Vraag van ". $gemeenteHoofdletter;
$voornaam; $achternaam;
$telefoon; $bericht;
$emailInfo; $klantInfo;
//Controleert de ingevulde velden
if (isset($_POST['f_email_van']) ||
isset($_POST['f_voornaam']) ||
isset($_POST['f_achternaam']) ||
isset($_POST['f_telefoon']) ||
isset($_POST['f_bericht'])) {
//Email info
$email_van = $_POST['f_email_van'];
$email_naar = "socialekaartpro#gmail.com";
/*Stuur Email
Dé Parameters:(emailInfo, klantInfo)*/
$emailInfo = array (
'email_van' => $email_van,
'email_naar' => $email_naar,
'email_onderwerp' => $email_onderwerp);
$klantInfo = array (
'voornaam' => $_POST['f_voornaam'],
'achternaam' => $_POST['f_achternaam'],
'telefoon' => $_POST['f_telefoon'],
'bericht' => $_POST['f_bericht'],
'locatie' => $gemeenteHoofdletter);
//Voeg de mail script toe zodat we de functie stuurEmail kunnen aanroepen
$mail = new EmailService('zorgvraag');
$mail -> versturen($emailInfo, $klantInfo);
}
?>
<!--=== Type Woning ===-->
<div class="page-topbar">
<div class="container">
<div class="row">
<div class="col-sm-4">
<h3>Bedrijfsnaam</h3>
</div>
<div class="col-sm-8 hidden-xs">
<ol class="breadcrumb">
<li>Gemeente Nijmegen</li>
<li>Woningverhuur</li>
<li class="active">Bedrijfsnaam</li>
</ol>
</div>
</div>
</div>
</div>
<div class="content container" style="padding-top: 10px;">
<div class="row">
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-heading left" style="margin-bottom: -1px;background-color: rgba(255, 255, 255, 0);"><i class="glyphicon glyphicon-menu-left"></i> Terug naar overzicht
<ul class="pull-right">
<i class="fa fa-print" aria-hidden="true"></i>Print
</ul>
</div>
</div>
</div>
</div>
</div>
<!--================================== Overzicht ========================-->
<div class="job-description">
<div class="container content">
<div class="row">
<div class="col-md-8">
<div class="left-inner" style="margin-left: 0px;">
<h3 style="margin-top: 28px;margin-bottom: 12px;">Test pagina</h3>
<p>
LEEG LEEG
</p>
<h3 style="margin-top: 40px;margin-bottom: 12px;">LEEG LEEG</h3>
<p>
LEEG LEEG
</p>
<h3 style="margin-top: 40px;margin-bottom: 12px;">LEEG LEEG</h3>
<p>
LEEG LEEG
</p>
<h3 style="margin-top: 40px;margin-bottom: 12px;">LEEG LEEG</h3>
<p>
LEEG LEEG
</p>
<br>
<br>
Naar de website LEEG LEEG
<br>
</div>
</div>
<div class="col-sm-4">
<div class="panel panel-default" style="margin-top: 9px;">
<div class="panel-heading" style="border-bottom-color: rgba(217, 217, 217, 0);margin-top: 2px;">Doelgroep</div>
<div class="panel-body">
<div class="row">
<p style="margin-top: -22px;margin-left: 16px;padding-right: 7px;">
LEEG | LEEG
</p>
</div>
</div>
<div class="panel-heading" style="border-bottom-color: rgba(217, 217, 217, 0);margin-top: -14px;">Leeftijdscatogarie</div>
<div class="panel-body">
<div class="row">
<p style="margin-top: -22px;margin-left: 16px;margin-bottom: 2px;">
LEEG | LEEG
</p>
</div>
</div>
</div>
<div class="panel panel-default" style="margin-top: 9px;">
<div class="panel-heading" style="border-bottom-color: rgba(217, 217, 217, 0);margin-bottom: -15px;">Contact gegevens</div>
<div class="panel-body">
<div class="row">
<div class="col-xs-4 col-md-4">
<p style="font-weight: 600;color: #000000;margin-bottom: 0px;">Naam</p>
<p style="font-weight: 600;color: #000000;margin-bottom: 0px;">Adres</p>
<p style="font-weight: 600;color: #000000;margin-bottom: 0px;">Postcode</p>
<p style="font-weight: 600;color: #000000;margin-bottom: 0px;">Plaats</p>
<p style="font-weight: 600;color: #000000;margin-bottom: 0px;">Telefoon</p>
</div>
<div class="col-xs-6 col-md-6" style="width: 65%;">
<p style="margin-bottom: 0px;">LEEG</p>
<p style="margin-bottom: 0px;">LEEG</p>
<p style="margin-bottom: 0px;">LEEG</p>
<p style="margin-bottom: 0px;">LEEG</p>
<p style="margin-bottom: 0px;">LEEG</p>
</div>
</div>
<hr style="margin-top: 20px;margin-bottom: 10px;">
<div class="row">
<div class="col-md-12">
<div class="panel-heading" style="margin-left: -15px;margin-top: -12px;margin-bottom: -15px;">
<h4 class="panel-title">
<span style="font-size: 13px;font-weight: 600;">Heeft u een zorgvraag, </span>
<a href="#mail-1" data-parent="#accordion-v1" data-toggle="collapse" class="accordion-toggle">
<span style="color: #3299bb;font-weight: 600;text-decoration: underline;"> klik dan hier</span>
</a>
</h4>
</div>
<!--Bevestiging script JSalert
<div>
<script src="https://socialekaartgemeente.nl/assets/js/sweetalert-dev.js"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<link rel="stylesheet" href="https://socialekaartgemeente.nl/assets/css/sweetalert.css">
<script type="text/javascript">
function JSalert(){
//event.preventDefault();;
swal("Congrats!", ", Uw mail is verzonden!", "success");
}
</script>
</div>-->
<!-- =============================[EMAIL FORM]================================== -->
<!-- onSubmit="window.location.reload()" -->
<!-- ="javascript:JSalert();" -->
<div class="panel-collapse collapse" id="mail-1">
<div class="panel-body" style="margin-left: -15px;">
<form action="" method="post" id="form_mail" >
<div class="row">
<div class="col-sm-12">
<div class="form-group">
<input id="voornaam" type="text" name="f_voornaam" class="form-control" placeholder="Voornaam*" required="required" data-error="Firstname is required.">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<input id="achternaam" type="text" name="f_achternaam" class="form-control" placeholder="Achternaam*" required="required" data-error="Firstname is required.">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<input id="telefoon" type="text" name="f_telefoon" class="form-control" placeholder="Telefoonnummer*" required="required" data-error="Firstname is required.">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
<input id="email" type="text" name="f_email_van" class="form-control" placeholder="Email*" required="required" data-error="Firstname is required.">
<div class="help-block with-errors"></div>
</div>
</div>
</div>
<div class="form-group">
<label class="sr-only" for="message">Bericht</label>
<textarea class="input-lg form-control" name="f_bericht" rows="5" id="bericht" placeholder="Uw zorgvraag"></textarea>
<span class="help-block"></span>
</div>
<!--Verzend knop-->
<button type="submit" class="btn btn-sm btn-primary" style="margin-bottom: -15px;">Bericht verzenden</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="panel panel-default" style="margin-top: 9px;">
<div class="panel-body">
<div class="row">
<div class="col-md-12">
<ul class="social-icons pull-left" style="margin-left: -2px;margin-top: 4px;margin-bottom: -8px;">
<li style="margin-left: 0px;"></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
</div>
</div>
<!-- Google Maps -->
<div class="panel panel-default" style="margin-top: 9px;">
<div class="panel-body">
<!-- Laad Google Maps -->
<style>#map-container { height: 200px }</style>
<div id="map-container" class="col-md-12"></div>
<script src="//maps.google.com/maps/api/js?sensor=false"></script>
<script>
function init_map() {
//Definieer de coordinaten en zet zoom level
var var_location = new google.maps.LatLng(00000000, 00000000);
var var_mapoptions = {
center: var_location,
zoom: 14
};
//Plaats de marker bij de coordinaten
var var_marker = new google.maps.Marker({
position: var_location,
map: var_map,
title:"Venice"});
//^Teken the map met de instellingen hierboven^
var var_map = new google.maps.Map(document.getElementById("map-container"),
var_mapoptions);
var_marker.setMap(var_map);
}
google.maps.event.addDomListener(window, 'load', init_map);
</script>
</div>
</div>
</div>
</div>
</div>
</div>
I keep getting this error:
Fatal error:
Class 'EmailService' not found in (/file location)
Which is in this case uploaded to the server so it can be easily called upon on the whole website. I have never had this problem with writing and using a class. What am I possibly doing wrong? A lot more people have posted the same question about this error before, but they seem to have a different setup.
You can not include file by URL.
You have to use path of File location on server.
This is wrong
include 'https://yourdomain.nl/assets/Email_Service.php'; //ONLINE
//require base_url() . 'assets/Email_Service.php'; //LOKAAL
you have to use absolute or relative path
include "assets/Email_Service.php"; //relative path
include "<directory_path_of_your_project_on_server>/assets/Email_Service.php"; //absolute path
How to get Server file Location
create test.php in your root of with below content
<?php
echo dirname(__FILE__);
die;
execute above from browser, will be display path of your project on server and use that path.
Could you guys help me with following problem:
my code:
<?php
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
if ($_POST['submit']) {
if (!$_POST['name']) {
$error="<br/>- S'il vous plaît entrez votre nom";
}
if (!$_POST['email']) {
$error.="<br/>- S'il vous plaît entrez votre email adresse";
}
if (!$_POST['message']) {
$error.="<br/>- S'il vous plaît entrez le message";
}
if (!$_POST['check']) {
$error.="<br/>- s'il vous plaît confirmer que vous êtes humain";
}
if ($error) {
$result='<div class="alert alert-danger" role="alert"> <strong> oups, vous avez un erreur : </strong>'.$error.'</div>';
} else {
mail("1992rax#gmail.com", "contact message", "<br> Name: ".$_POST['name']."<br> Email: ".$_POST['email']."<br> Message: ".$_POST['message'],$headers);
$result='<div class="alert alert-success" role="alert"> merci votre message a été envoyer</div>';
}
}
?>
<!DOCTYPE html>
<html lang="fr">
<head>
<title>fowaj project website</title>
<meta charset="utf-8" >
<meta name="author" content="oussama el badaoui" >
<meta name="description" content="this is an website comunity gallery of images hummour">
<meta name="viewport" content="width=device-width, initial-scale=1.0" >
<link rel="icon" href="favicon.png">
<!--[if IE]><link rel="shortcut icon" href="favicon.ico"><![endif]-->
<!-- Bootstrap main css -->
<link href="layout/css/bootstrap.css" rel="stylesheet">
<!-- custom css -->
<link href="layout/css/custom.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.php">
<img src="layout/images/logo.png" alt="fowaj project" />
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active">Accueil <span class="sr-only">(current)</span></li>
<li>Contacte</li>
<li>Politique de confidentialité</li>
<li>termes et conditions</li>
<li>à propose</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<form class="navbar-form navbar-left" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></button>
</form>
<li>Connexion</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<section id="contact">
<div class="container">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<h1>contact formulaire </h1>
<?php echo $result;?>
<p> envoyer votre message par cette formulaire</p>
<form method="post" role="form">
<div class="form-group">
<input type="text" name="name" class="form-control" placeholder="enter votre nome" value="<?php echo $_POST['name'];?>">
</div>
<div class="form-group">
<input type="email" name="email" class="form-control" placeholder="enter votre email" value="<?php echo $_POST['email'];?>">
</div>
<div class="form-group">
<textarea name="message" rows="5" class="form-control" placeholder="enter votre message ..."><?php echo $_POST['message'];?></textarea>
</div>
<div class="checkbox">
<label>
<input type="checkbox" name="check"> je suis humain
</label>
</div>
<div align="center">
<input type="submit" name="submit" class="btn btn-secondary" value="envoyer le message" />
</div>
</form>
</div>
</div>
</div>
</section>
<footer>
<div class="list-group col-md-4">
<a class="list-group-item active">Catégories:</a>
<a class="list-group-item" href="#">Caricatures</a>
<a class="list-group-item" href="#">Cinéma et tv</a>
<a class="list-group-item" href="#">Politique</a>
<a class="list-group-item" href="#">enfants</a>
<a class="list-group-item" href="#">animaux</a>
</div>
<div class="list-group col-md-4">
<a class="list-group-item active">les Pages de site:</a>
<a class="list-group-item" href="contact.php">Contacter Nous</a>
<a class="list-group-item" href="Privacy-policy.htm">Politique de confidentialité</a>
<a class="list-group-item" href="term-and-conditions.htm">termes et conditions</a>
<a class="list-group-item" href="about-us.htm">à propose de Nous</a>
<a class="list-group-item" href="#" data-toggle="modal" data-target="#regModal" >ajouter votre image</a>
</div>
<div class="list-group col-md-4">
<a class="list-group-item active">média sociaux:</a>
<a class="list-group-item" href="http://facebook.com/fowajproject" target="new">facebook</a>
<a class="list-group-item" href="http://twitter.com/fowajproject" target="new">twitter</a>
<a class="list-group-item" href="http://youtube.com/fowajproject" target="new">youtube</a>
<a class="list-group-item" href="http://plus.google.com/fowajprojetc" target="new">google plus</a>
</div>
<div class="col-md-12 col-sm-12 footer-info">
copyright © 2016 fowaj project made in morocco by oussama el badaoui
</div>
</footer>
</body>
</html>
You haven't defined $header!!! At the top of your file you have:
<?php
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
You are appending with .= something to a variable that doesn't exist!
Instead, simply define $headers with =:
<?php
$headers = "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
That should do the trick.
You should add the code from the dropbox link you gave me in your first post.
You should try this:
if (isset($_POST['submit']) && $_POST['submit']) {
if (!$_POST['name']) {
$error = "<br/>- S'il vous plaît entrez votre nom";
}
if (!$_POST['email']) {
$error = "<br/>- S'il vous plaît entrez votre email adresse";
}
if (!$_POST['message']) {
$error = "<br/>- S'il vous plaît entrez le message";
}
if (!$_POST['check']) {
$error = "<br/>- s'il vous plaît confirmer que vous êtes humain";
}
if ($error) {
$result='<div class="alert alert-danger" role="alert"> <strong> oups, vous avez un erreur : </strong>'.$error.'</div>';
} else {
mail("1992rax#gmail.com", "contact message", "<br> Name: ".$_POST['name']."<br> Email: ".$_POST['email']."<br> Message: ".$_POST['message'],$headers);
$result ='<div class="alert alert-success" role="alert"> merci votre message a été envoyer</div>';
}
}
I m recording an imacro macro.
Here is my script:
VERSION BUILD=8920312 RECORDER=FX
TAB T=1
TAG POS=1 TYPE=EM ATTR=TXT:Lui<SP>écrire
TAG POS=1 TYPE=INPUT:TEXT FORM=ID:postform ATTR=ID:subj CONTENT=Hello
TAG POS=1 TYPE=TEXTAREA FORM=ID:postform ATTR=ID:text CONTENT=Bonjour
TAG POS=1 TYPE=INPUT:CHECKBOX FORM=ID:postform ATTR=ID:inclure CONTENT=YES
TAG POS=1 TYPE=INPUT:SUBMIT FORM=ID:postform ATTR=*
Here is the code in the body of the page:
<div id="form-subj" class="rc-form-field ">
<label for="subj">Sujet :</label>
<span class="field-wrapper">
<input id="subj" type="text" value="" name="subj" maxlength="40">
</span>
</div>
I attached a capture too of the page.
I suppose that the field-wrapper is causing the error.
The attachment of the Page HTML is not complete.
Please revise.
Sorry for my late answer.
Here is the page html
<div id="content">
<div id="ctn-iframe">
<p id="load-iframe" style="display: none;">
<img src="/static/img/loader.gif?v2.2"/>
</p>
<iframe data-src="http://legacy.reseaucontact.com/bp/?action=post&ruid=3923690" frameborder="0" id="iframe-legacy" name="iframeLegacy" width="100%" scrolling="no" onload="window.parent.scroll(0,0);" src="http://legacy.reseaucontact.com/bp/?action=post&ruid=3923690" style="display: inline-block; height: 623px;"/>
</div>
</div>
<div id="aside">
<div class="inner">
<section id="search-container">
<script type="text/javascript" src="/static/bundles/applicationrc/js/plugin/jquery-ui.js?v2.2"/>
<script type="text/javascript">
<section id="widget-community-stats">
<section id="widget-selection-mois" class="widget autopromo">
<div>
<h3 class="footer-title">
<div class="clearfix">
<p>Vous voulez plus de visites sur votre fiche? Envoyez-nous votre photo pour être membre-vedette!</p>
Soumettre ma photo
</div>
</div>
<script type="text/javascript">
</section>
</div>
</div>
<div id="main-footer">
<div class="inner-shadow" style="display: block;" id="inner-shadow-1"/>
<div class="inner-shadow" style="display: block;" id="inner-shadow-2"/>
<div class="inner-shadow" style="display: block;" id="inner-shadow-3"/>
</div>
</div>