2016-10-05 6 views
1

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

// 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:%20check_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 = '[email protected]'; 
 
$subject = $ordertype; 
 
$body = "From: ".$name. 
 
"\r\n E-Mail: ".$email. 
 
"\r\n Message: \r\n".$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.

+0

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

+0

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

+0

@SanjivDhakal Order CoopDaddio

ответ

1

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

Смежные вопросы