Загрузочный файл формы Bootstrap 4 & Phpmailer
Я думаю, что это довольно просто понять, но я действительно не знаю, с чего начать. То, что я хотел бы, это вариант в форме, где люди могут добавить изображение или другой файл.
Я добавил это в моей форме начальной загрузки:
<!--attachments-->
<div class="form-group">
<label for="attachment">Attachment</label>
<input type="file" class="form-control-file" name="attachmentFile" id="attachmentFile">
</div>
Пока все хорошо, я думаю. Но он не отправит, потому что в моем файле phpmailer / send.php должно быть что-то добавлено. Это скрипт, который я использую сейчас:
<?php
require 'PHPMailerAutoload.php';
// Controleren of het formulier is verzonden dmv submit
if (isset($_POST['submitted'])) {
$errors = array(); // Initialize error array.
// Geef hier zoveel mogelijk vereiste velden voor validatie
//Add attachment
if(is_array($_FILES)) {
$mail->AddAttachment($_FILES['attachmentFile']
['tmp_name'],$_FILES['attachmentFile']['name']);
}
// Controleer naam
if (!preg_match("/^[a-zA-Z]+[a-zA-Z[:space:]]{2,}$/", $_POST['naam'])) {
$errors[] = 'Naam';
}
// Controleer adres
if (!preg_match("/^[a-zA-Z[:space:]]{1,}$/", $_POST['straat'])) {
$errors[] = 'Adres';
}
// Controleer huisnummer
if (!preg_match("/^[0-9]{1,4}$/", $_POST['huisnummer'])) {
$errors[] = 'Huisnummer';
}
// Controleer postcode
if (!preg_match("/^[0-9]{4}$/", $_POST['postcode'])) {
$errors[] = 'Postcode (Cijfers)';
}
// Controleer postcode letters
if (!preg_match("/^[a-zA-Z]{2}$/", $_POST['letters'])) {
$errors[] = 'Postcode (Letters)';
}
// Controleer woonplaats
if (!preg_match("/^[a-zA-Z]+[a-zA-Z[:space:]]{2,}$/", $_POST['woonplaats'])) {
$errors[] = 'Woonplaats';
}
// Controleer Kengetal
if (!preg_match("/^[0]{1}[0-9]{1,3}$/", $_POST['kengetal'])) {
$errors[] = 'Kengetal';
}
// Controleer telefoonnummer
if (!preg_match("/^[0-9]{6,8}$/", $_POST['telefoon'])) {
$errors[] = 'Telefoonnummer';
}
// Controleer e-mail adres
if (!preg_match("/^([a-zA-Z0-9])+([\.a-zA-Z0-9_-])*@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-]+)*\.([a-zA-Z]{2,})$/", $_POST['email'])) {
$errors[] = 'E-mail adres';
}
// Controleer tekstvak
if (empty($_POST['bericht'])) {
$errors[] = 'Bericht';
}
if (empty($errors)) {
// Voer hier de gegevens in
$mailFrom = "myEmail";
$mailTo = "myEmail";
$senderNaam = $_POST['naam'];
$senderEmail = $_POST['email'];
$subject = 'mySubject';
$okMessage = '<p>blablabla</p>';
$errorMessage = '<p>blablabla</p>';
$emailText .= "Naam: " . $_POST['titel']." ". $_POST['naam']. "\n";
$emailText .= "Bedrijfsnaam: " . $_POST['bedrijfsnaam']. "\n";
$emailText .= "Adres: " . $_POST['straat']." ". $_POST['huisnummer']." ". $_POST['toevoeging']. "\n";
$emailText .= "Postcode: " . $_POST['postcode']." ". $_POST['letters']. "\n";
$emailText .= "Woonplaats: " . $_POST['woonplaats']. "\n";
$emailText .= "Telefoonnummer: " . $_POST['kengetal']." ". $_POST['telefoon']. "\n";
$emailText .= "E-mailadres: " . $_POST['email']. "\n";
$emailText .= "Bericht: " . $_POST['bericht']. "\n";
$mail = new PHPMailer;
$mail->CharSet = 'UTF-8';
$mail->isSMTP(); // Set mailer to use SMTP
$mail->Host = 'SMTP SERVER'; // Specify main and backup SMTP servers
$mail->SMTPAuth = true; // Enable SMTP authentication
$mail->Username = 'User'; // SMTP username
$mail->Password = 'Pass'; // SMTP password
$mail->SMTPSecure = 'ssl'; // Enable TLS encryption, `ssl` also accepted
$mail->Port = 465; // TCP port to connect to
$mail->Sender = $mailFrom;
$mail->SetFrom($senderEmail, $senderNaam);
$mail->AddReplyTo($senderEmail, $senderNaam);
$mail->Subject = $subject;
$mail->MsgHTML($emailText);
$mail->AddAddress($mailTo, $mailTo);
$mail->addAttachment($uploadfile, 'My uploaded file'); **// ADDED THIS HERE**
$mail->isHTML(true); // Set email format to HTML
$mail->Subject = $subject;
$mail->Body = "<table>
<tr><td style='padding-left: 10px; padding-right: 10px; background: #eee;'>Naam:</td><td style='padding-left: 10px; font-weight: bold;'>".$_POST['titel']." ".$_POST['naam']."</td></tr>
<tr><td style='padding-left: 10px; padding-right: 10px; background: #eee;'>Bedrijfsnaam:</td><td style='padding-left: 10px; font-weight: bold;'>".$_POST['bedrijfsnaam']."</td></tr>
<tr><td style='padding-left: 10px; padding-right: 10px; background: #eee;'>Adres:</td><td style='padding-left: 10px; font-weight: bold;'>".$_POST['straat']." ".$_POST['huisnummer']." ".$_POST['toevoeging']."</td></tr>
<tr><td style='padding-left: 10px; padding-right: 10px; background: #eee;'>Postcode:</td><td style='padding-left: 10px; font-weight: bold;'>".$_POST['postcode']." ".$_POST['letters']."</td></tr>
<tr><td style='padding-left: 10px; padding-right: 10px; background: #eee;'>Woonplaats:</td><td style='padding-left: 10px; font-weight: bold;'>".$_POST['woonplaats']."</td></tr>
<tr><td style='padding-left: 10px; padding-right: 10px; background: #eee;'>Telefoonnummer:</td><td style='padding-left: 10px; font-weight: bold;'>".$_POST['kengetal']." ".$_POST['telefoon']."</td></tr>
<tr><td style='padding-left: 10px; padding-right: 10px; background: #eee;'>E-mailadres:</td><td style='padding-left: 10px; font-weight: bold;'>".$_POST['email']."</td></tr>
<tr><td style='padding-left: 10px; padding-right: 10px; background: #eee;'>Bericht:</td><td style='padding-left: 10px; font-weight: bold;'>".$_POST['bericht']."</td></tr>
</table>";
$mail->AltBody = $emailText;
if(!$mail->send()) {
$responseArray = array('type' => 'danger', 'message' => $errorMessage);
} else {
$responseArray = array('type' => 'success', 'message' => $okMessage);
}
}
if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
$encoded = json_encode($responseArray);
header('Content-Type: application/json');
echo $encoded;
} else {
echo $responseArray['message'];
}
}
?>
Также добавил это в <form> ENCTYPE = "многочастному / форм-данных"
Изменить #2: у меня также есть файл contact.js с этим:
data: $(this).serialize(),Я изменил это в этом:data: new FormData(this),Потому что я где-то читал, что это может быть проблемой, но это не имело смысла.
1 ответ
Решение
Хорошо, форма отправляется с вложениями! Есть только одна маленькая вещь, я надеюсь, что кто-то может помочь мне с этим.. подробнее об этом позже. Сначала код.
В contact.js - мне пришлось поменять data: $(this).serialize(), в data: new FormData(this),
$(function () {
$('#contact-form').validator();
$('#contact-form').on('submit', function (e) {
if (!e.isDefaultPrevented()) {
var url = "send.php";
$.ajax({
type: "POST",
url: url,
data: new FormData(this),
cache : false,
contentType : false,
processData : false,
success: function (data)
{
var messageAlert = 'alert-' + data.type;
var messageText = data.message;
var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>' + messageText + '</div>';
if (messageAlert && messageText) {
$('#contact-form').find('.messages').html(alertBox);
$('#contact-form')[0].reset(); //Remove this line if form should not reset after submit
$('body, html').animate({scrollTop:$('#contact-form').offset().top}, 'fast'); //Remove this line if form should not scroll to top of the form after submit
}
}
});
return false;
}
})
});
Myform.html - 2 вещи: это enctype="multipart/form-data" в <form>, и это
<!--attachments-->
<div class="form-group">
<label for="attachment">Attachment</label>
<input type="file" class="form-control-file" name="attachmentFile" id="attachmentFile">
</div>
где вы хотите в форме.
Наконец, поместите это в ваш файл phpmailer:
//Add attachment
if(is_array($_FILES)) {
$mail->AddAttachment($_FILES['attachmentFile']['tmp_name'],$_FILES['attachmentFile']['name']);
}
Я сделал это ниже $mail->AddAddress($mailTo, $mailTo);
Пока как это исправить. Осталась еще одна проблема, о которой я говорил в начале.
Без data: new FormData(this), Я все еще получаю свое okMessage (с разметкой), когда нажимаю кнопку отправить, и форма остается на той же странице.
С data: new FormData(this), он переходит на новую страницу и просто дает черный на белом простой текст (без разметки). Так что, как FormData, что-то перекрывает. Надеюсь, кто-то может помочь мне с этим.
РЕДАКТИРОВАТЬ: Кажется, я тоже это исправил. Поместите это..
cache : false,
contentType : false,
processData : false,
..ниже data: new FormData(this),