Блог

Главная - Вопросы по программированию - Форма не отправляет электронное письмо?

Форма не отправляет электронное письмо?

#javascript #php #html

#javascript #php #HTML

Вопрос:

Я создал форму, которая появляется при нажатии кнопки. Однако при нажатии кнопки окончательной отправки окончательное электронное письмо не отправляется. Где ошибки в моем коде?

 // JavaScript Document
// Validating Empty Field
function check_empty() {
    if (document.getElementById('name').value == "" || document.getElementById('email').value == "") {
      alert("Please fill out all fields.");
    } else {
      alert("Order Successful!");
    }
  }
  //Function To Display Popup

function div_show1() {
  document.getElementById("ordertype").innerHTML = "$400 Website Order";
  document.getElementById('abc').style.display = "block";
}

function div_show2() {
  document.getElementById("ordertype").innerHTML = "$500 Website Order";
  document.getElementById('abc').style.display = "block";
}

function div_show3() {
    document.getElementById("ordertype").innerHTML = "$700 Website Order";
    document.getElementById('abc').style.display = "block";
  }
  //Function to Hide Popup

function div_hide() {
  document.getElementById('abc').style.display = "none";
}  
 @charset "utf-8";

/* CSS Document */

#abc {
  width: 100%;
  height: 100%;
  opacity: 0.97;
  top: 0;
  left: 0;
  display: none;
  position: fixed;
  background-color: #313131;
  overflow: auto;
  z-index: 9999999;
}
img#close {
  position: absolute;
  right: -14px;
  top: -14px;
  cursor: pointer;
}
div#popupContact {
  position: absolute;
  left: 50%;
  top: 17%;
  margin-left: -202px;
  font-family: coolfont;
}
form {
  max-width: 300px;
  min-width: 250px;
  padding: 10px 50px;
  border: 2px solid gray;
  border-radius: 10px;
  font-family: coolfont;
  background-color: #fff;
}
p {
  margin-top: 30px;
}
h2 {
  background-color: #FEFFED;
  padding: 20px 35px;
  margin: -10px -50px;
  text-align: center;
  border-radius: 10px 10px 0 0;
  font-family: info;
}
hr {
  margin: 10px -50px;
  border: 0;
  border-top: 1px solid #ccc;
}
input[type=text] {
  width: 82%;
  padding: 10px;
  margin-top: 30px;
  border: 1px solid #ccc;
  padding-right: 40px;
  font-size: 16px;
  font-family: coolfont;
}
textarea {
  width: 82%;
  height: 95px;
  padding: 10px;
  resize: none;
  margin-top: 30px;
  border: 1px solid #ccc;
  padding-right: 40px;
  font-size: 16px;
  font-family: coolfont;
  margin-bottom: 30px;
}
#submit {
  text-decoration: none;
  width: 100%;
  text-align: center;
  display: block;
  background-color: #FFBC00;
  color: #fff;
  border: 1px solid #FFCB00;
  padding: 10px 0;
  font-size: 20px;
  cursor: pointer;
  border-radius: 5px;
}
@media only screen and (max-width: 457px) {
  form {
    max-width: 200px;
    min-width: 150px;
    padding: 10px 50px;
    margin-left: 50px;
  }
  input[type=text] {
    padding-right: 30px;
  }
  textarea {
    padding-right: 30px;
  }
}
@media only screen and (max-width: 365px) {
  form {
    max-width: 140px;
    min-width: 90px;
    padding: 10px 50px;
    margin-left: 80px;
  }
  input[type=text] {
    padding-right: 10px;
  }
  textarea {
    padding-right: 10px;
  }
}  
 <head>
  <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
  <link href="elements.css" rel="stylesheet">
  <script src="my_js.js"></script>
</head>

<body>
  <a class="button" id="popup" onclick="div_show1()">ORDER NOW</a>
  <a class="button" id="popup" onclick="div_show2()">ORDER NOW</a>
  <a class="button" id="popup" onclick="div_show3()">ORDER NOW</a>
  <div id="abc">
    <!-- Popup Div Starts Here -->
    <div id="popupContact">
      <!-- Contact Us Form -->
      <form action="form.php" id="form" method="post" name="form" enctype="multipart/form-data">
        <img id="close" src="images/redcross.png" width="50" onclick="div_hide()">
        <h2 id="ordertype" name="ordertype">$400 Website Order</h2>
        <hr>
        <input id="name" name="name" placeholder="Name" type="text">
        <input id="email" name="email" placeholder="Email" type="text">
        <textarea id="msg" name="message" placeholder="Comments/Questions"></textarea>
        <a href="javascript: check_empty()" id="submit">Order</a>
      </form>
    </div>
    <!-- Popup Div Ends Here -->
  </div>
</body>  

 <? php
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$from = '#';
$to = 'sample@gmail.com';
$subject = $ordertype;
$body = "From: ".$name.
"rn E-Mail: ".$email.
"rn Message: rn".$message;

if (isset($_POST['submit'])) {
  if (mail($to, $subject, $body, $from)) {
    echo '<script>
            alert("Message successfully sent.");
      </script>';
  } else {
    echo '<p>Something went wrong, go back and try again!</p>';
  }
}

?>

Последний прикрепленный фрагмент кода — это form.php файл, на который я пытался ссылаться в HTML-формате.

Комментарии:

1. Посмотрите, как построен заголовок на странице PHP mail() — php.net/manual/en/function.mail.php

2. Я не видел кнопки отправки, которая отправляет форму

3. @SanjivDhakal <a href=»javascript: check_empty()» id=»отправить»>Заказать</a>

4. Скажите нам, что это пространство здесь <? php не является частью вашего реального кода.

5. Это if (isset($_POST['submit'])){...} тоже никогда не срабатывает. Проверьте наличие ошибок с помощью PHP и посмотрите на свою консоль.

Ответ №1:

Я обнаружил, что все работает, но его нужно было загрузить на хостинг-сервер, чтобы он мог успешно отправлять электронные письма. Это решение.