форма с ajax - форма сообщения php без обновления страницы

Question

Я хочу отправить форму с помощью ajax-вызова без обновления страницы

HTML

<form id="form">
<input type="radio" name="radio" value="radio1">
<input type="radio" name="radio" value="radio1">

<input type="checkbox" name="box" value="box1">
<input type="checkbox" name="box" value="box2">

<input type="text" name="text" value="box2">

<input type="submit" id="submit" name="submit" class="embtn btn-1" value="Send" onclick="submitform()">

</form>

Это код JS

function submitform(e) {
    e.preventDefault();
    $.ajax({
        url : 'assets/php/brief-wiz.php', 
        type: 'post', 
        data: $('form').serialize() 
    }).done(function(html) {
        $( ".form-message" ).append( html );
    });
};

PHP

<?php

$errors = [];

if (empty($_POST["radio"])) {
    $errors[] = "Complete radio ";
} else { 
    $radio = implode($_POST['radio']);
}

if (empty($_POST["box"])) {
    $errors[] = "Complete box ";
} else { 
    $box = implode($_POST['box']);
}

$text = ($_POST['text']);   

$body = "";

$body .=  "<div><b>1:</b> " . $profil . "</div>";
$body .=  "<div><b>2:</b> " . $box . $text . "</div>";

$to       = 'mymail@com.pl';
$subject  = 'Contact;
$message  =  $body;

$headers = "From: webmaster@example.com" . "\r\n";
$headers .= "Reply-To: " . "\r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=UTF-8\r\n";

$success = mail($to, $subject, $message, $headers);


echo $success ? "Mail sended" : "Error";


?>

Теперь моя страница перезагружается без сообщений.

Без этого кода:

(e) {
    e.preventDefault();
}

Сообщения отображаются в течение одной секунды, но страница перезагружается. Как я могу загрузить сообщения, используя PHP без обновления страницы.

Answer 1

Это потому, что тип вашей кнопки - отправить! Я предлагаю вам использовать это вместо:

<button id="submit" class="embtn btn-1" onclick="submitform()">Send</button>

Answer 2

Измените тип ввода отправки на кнопку.