Кнопка «Отправить» не работает в форме «Bootstrap»

У меня есть форма в Bootstrap 3, которая находится внутри модального. Есть кнопка под названием «отправить», где, когда она нажата, материал, который был введен в форму, должен быть отправлен на адрес электронной почты. Хотя, когда я нажимаю «Отправить», ничего не происходит.

кто-нибудь знает, почему это произошло? Вот форма:

<div class="modal fade" id="contactPop" tabindex="-1" role="dialog" aria-labelledby="contactModal" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <!-- Close button. --> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> <!-- Title. --> <h3 class="modal-title" style="font-family: 'Lato', sans-serif; font-weight: 700;"> Contact Us <small style="font-family: 'Lato', sans-serif; font-weight:400;"> You matter to us.</small> </h3> </div> <!-- User input fields. --> <form class="contact" action="process.php" method="post"> <div class="modal-body"> <div class="row"> <div class="col-sm-6"> <label class="control-label">Subject</label> <input type="text" class="form-control" required="required" placeholder="I aciddentally the website!" name="subject"> </div> <div class="col-sm-6"> <label class="control-label">Username</label> <input type="text" class="form-control" required="required" placeholder="Notch" name="username"> </div> </div> <br> <div class="row"> <div class="col-sm-6"> <label class="control-label">Message</label> <textarea class="form-control" rows="8" style="resize: vertical;" required="required" placeholder="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eget fermentum justo, sit amet semper." name="message"></textarea> </div> <div class="col-sm-6"> <label class="control-label">Email</label> <input type="email" class="form-control" required="required" placeholder="johnsmith@example.com" name="email"> </div> <div class="col-sm-6" style="line-height: 21px;"> <br> <p>Responses are usually received within 1-2 business days.</p> <p>Please be as clear and concise as possible, in order to help us process your inquiry faster.</p> </div> </div> </div> <!-- Close & submit buttons. --> <div class="modal-footer"> <button type="button" class="btn btn-info" data-dismiss="modal"><i class="glyphicon glyphicon-remove"></i> Close</button> <button type="button" value=" Send" class="btn btn-success" type="submit" id="submit"><i class="glyphicon glyphicon-inbox"></i> Submit</button> </div> </div> </div> </div>

Также есть process.php, который отправляет форму, которая находится здесь:

 <?php //add the recipient's address here $myemail = 'contact@tinymine.info'; //grab named inputs from html then post to #thanks if (isset($_POST['name'])) { $name = strip_tags($_POST['name']); $email = strip_tags($_POST['email']); $message = strip_tags($_POST['message']); echo "<span class=\"alert alert-success\" >Your message has been received, and we will get back to you as soon as possible. Here is what you submitted:</span><br><br>"; echo "<stong>Name:</strong> ".$name."<br>"; echo "<stong>Email:</strong> ".$email."<br>"; echo "<stong>Message:</strong> ".$message."<br>"; //generate email and send! $to = $myemail; $email_subject = "Contact form submission: $name"; $email_body = "You have received a new message. ". " Here are the details:\n Name: $name \n ". "Email: $email\n Message \n $message"; $headers = "From: $myemail\n"; $headers .= "Reply-To: $email"; mail($to,$email_subject,$email_body,$headers); } ?>

А затем в индексе есть также javascript, который должен представить форму.

  <script type="text/javascript"> $(document).ready(function () { $("input#submit").click(function(){ $.ajax({ type: "POST", url: "process.php", //process to mail data: $('form.contact').serialize(), success: function(msg){ $("#thanks").html(msg) //hide button and show thank you $("#form-content").modal('hide'); //hide popup }, error: function(){ alert("failure"); } }); }); }); </script>

Если кто-то может помочь, это будет очень полезно!

Ваша проблема в этом

 <button type="button" value=" Send" class="btn btn-success" type="submit" id="submit" />

Вы задали тип дважды. Ваш браузер принимает только первый, который является «кнопкой».

 <button type="submit" value=" Send" class="btn btn-success" id="submit" />

Заменить это

  <button type="button" value=" Send" class="btn btn-success" type="submit" id="submit">

 <button value=" Send" class="btn btn-success" type="submit" id="submit">

Если вы положили type=submit это кнопка Submit
если вы положили type=button это просто кнопка , она не отправит ваши входы формы.

а также вы не хотите использовать оба эти