Mail form with html php and ajax

Hello,
This might be a bit newbie question but I can’t figure out the problem why I can’t send the email using the code below.
So I have 2 pop-up forms on the website, one is for calling back and another for the interest of the product.
HTML

<div class="modal" id="thanks">
		<div class="modal__title">
			Thank you!
		</div>
		<div class="modal__image">

		</div>
		<div class="modal__footer">
			we will keep in touch!
		</div>
	</div>

	<div class="modal" id="product">
		<form action="send.php" method="post">
		    <input type="hidden" name="form" value="">
			<div class="modal__sub">
				Product
			</div>
			<div class="modal__title" id="modal-title">
				Leave your number and we will call you back
			</div>
			<div class="modal__content">
				<div class="form-group">
					<label for="">your name</label>
					<input type="text" name="name">
				</div>
				<div class="form-group">
					<label for="">your number</label>
					<input type="tel" name="phone">
				</div>
				<div class="form-group">
					<button type="submit" class="btn">

						<span>Send</span>
					</button>
				</div>
				<div class="form-text">
				</div>
			</div>
		</form>
	</div>

	<div class="modal" id="call">
		<form action="send.php" method="post">
		    <input type="hidden" name="form" value="Order call">
			<div class="modal__title" id="modal-title">
				Leave your details and we will call you back
			</div>
			<div class="modal__content">
				<div class="form-group">
					<label for="">your number</label>
					<input type="text" name="name">
				</div>
				<div class="form-group">
					<label for="">your phone</label>
					<input type="tel" name="phone">
				</div>
				<div class="form-group">
					<button type="submit" class="btn">
						<span>Send</span>
					</button>
				</div>
				<div class="form-text">
				</div>
			</div>
		</form>
	</div>

So, I’m using PHP mailer for that and the script looks like this:

<?php 

require_once('phpmailer/PHPMailerAutoload.php');
$mail = new PHPMailer;
$mail->CharSet = 'utf-8';

$form = $_POST['name'];
$phone = $_POST['phone'];      
       
$mail->isSMTP();                                     
$mail->Host = 'smtp.mail.com';  																							
$mail->SMTPAuth = true;                          
$mail->Username = 'no-reply@website.com'; 
$mail->Password = 'password'; 
$mail->SMTPSecure = 'ssl';                       
$mail->Port = 465; 

$mail->setFrom('no-reply@website.com'); 
$mail->addAddress('myemail@mail.com');    

$mail->isHTML(true);                                

$mail->Subject = 'Website Form';
$mail->Body    = '' .$name . ' and the number is  ' .$phone;
$mail->AltBody = '';

if(!$mail->send()) {
    echo 'Error';
} else {
    header(src: "#thanks");
}
// ?>

and for the JS script is this :

     $(document).on("submit", "form", function () {
        var e = $(this),
            t = !1;
        return (
            e.find("input").removeClass("error"),
            e.find("input").parent().removeClass("error"),
            e.find('[name="phone"]').each(function () {
                "" == $(this).val() && ($(this).addClass("error"), $(this).parent().addClass("error"), (t = !0));
            }),
            t ||
                $.ajax({ url: "send.php", type: "POST", data: e.serialize() })
                    .done(function (e) {
                        $.fancybox.close("all"),
                            $.fancybox.open({ src: "#thanks" }),
                            setTimeout(function () {
                                $.fancybox.close("all");
                            }, 3e3),
                            $("input, textarea").val("");
                    })
                    .always(function () {
                        $("input[type=submit], button[type=submit]").removeAttr("disabled");
                    })
                    .fail(function (e) {
                        console.log(e);
                    }),
            !1
        );
    });

Sometimes I’m getting a loop and it’s constantly sending the emails :frowning: I’m just stuck and don’t even know where to dig. Any suggestions would be highly appreciated.

Thanks.

I’m not sure where the JS is executed, but the following line doesn’t look quite right

$form = $_POST['name'];

You could try adding

$mail->SMTPDebug = 2;

to try debug mode.

1 Like

Hello Gandalf,
The flow is next: from the HTML form → it calls JS (ajax) → PHP (send.php) file.

Thank you for you feedback.

oh, yeah you are right, instead of form, it should be name = $_POST(‘name’)…
Now it workes, oh thank you Gandalf for your hit :wink:

1 Like