모달 연락처 양식 필수 입력란이 작동하지 않습니다.

Question

내 페이지에 연락처 양식이있는 모달 있습니다. 어쨌든 메일과 같은 필드는 필수 항목이어야하지만 필드가 채워지지 않은 경우에도 즉시 전송됩니다. 어떻게 가능합니까?

모달 :

<div class="modal fade" id="form-content" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
     <div class="modal-header" style="border-bottom: none;"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title">Contact</h4> 
      </div> 
     <div class="modal-body"> 
      <form class="contact" name="contact"> 
      <div class="input-group"> 
       <span class="input-group-addon"><i class="fa fa-user"></i></span> 
       <input type="text" name="name" class="form-control" placeholder="Name" required="required"> 
      </div> 
      <br/> 
      <div class="input-group"> 
       <span class="input-group-addon"><i class="fa fa-envelope"></i></span> 
       <input type="email" name="email" class="form-control" placeholder="Mail"> 
      </div> 
      <br/> 
      <div class="input-group"> 
       <span class="input-group-addon"><i class="fa fa-globe"></i></span> 
       <input type="url" name="website" class="form-control" placeholder="Website"> 
      </div> 
      <br/> 
      <textarea rows="6" name="message" class="form-control" placeholder="Message"></textarea> 
      </form> 
     </div> 
     <div class="modal-footer" style="border-top: none;"> 
      <input class="btn btn-success" type="submit" value="Send!" id="submit"> 
     </div> 
     </div> 
    </div> 
    </div> 

PHP 스크립트 :

<?php 
$myemail = 'mail@mail.nl'; 
if (isset($_POST['name'])) { 
$name = strip_tags($_POST['name']); 
$email = strip_tags($_POST['email']); 
$message = strip_tags($_POST['message']); 
$website = strip_tags($_POST['website']); 
echo "<br><span style=\"display:table; margin:0 auto;\" class=\"alert alert-success\" id=\"alert-message\" data-alert=\"alert\">Your message has been received. Thank you!</span>"; 


$to = $myemail; 
$email_subject = "Contact formulier van: $name"; 
$email_body = "Je hebt een nieuw bericht ontvangen via het contactformulier. ". 
"Hier zijn de de details:\n Naam: $name \n ". 
"Email: $email\n Website: $website \n Bericht: \n $message"; 
$headers = "From: $email\n"; 
$headers .= "Reply-To: $email"; 
mail($to,$email_subject,$email_body,$headers); 
}?> 

편집 :

: 나는 또한 양식이 발송에 실패 된 사람들에게 보여하려면 main.js를 하바

$(document).ready(function() { 
    $("input#submit").click(function(){ 
    $.ajax({ 
     type: "POST", 
     url: "process.php", // 
     data: $('form.contact').serialize(), 
     success: function(msg){ 
     $("#thanks").html(msg) 
     $("#form-content").modal('hide'); 
     $('#thanks').delay(3000).fadeOut() 
     }, 
     error: function(){ 
     alert("failure"); 
     } 
    }); 
    }); 
}); 

Answer 1

양식에 다음과 같은 작업과 방법이 누락되었습니다. action 당신의 PHP 코드로이 경우 POST, 당신은 데이터를 전송하는 방식으로 PHP 페이지와 method을 의미 action="yourpage.php" method="POST"

당신은 $_POST['name'] (등)이있다.

제출 내용은 안에 내부가 아닌 양식 태그 여야합니다. 이 같은

뭔가 :

이

<div class="modal fade" id="form-content" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
<div class="modal-dialog"> 
    <div class="modal-content"> 
    <div class="modal-header" style="border-bottom: none;"> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h4 class="modal-title">Contact</h4> 
     </div> 
    <div class="modal-body"> 
     <form class="contact" name="contact"> 
     <div class="input-group"> 
      <span class="input-group-addon"><i class="fa fa-user"></i></span> 
      <input type="text" name="name" class="form-control" placeholder="Name" required="required"> 
     </div> 
     <br/> 
     <div class="input-group"> 
      <span class="input-group-addon"><i class="fa fa-envelope"></i></span> 
      <input type="email" name="email" class="form-control" placeholder="Mail"> 
     </div> 
     <br/> 
     <div class="input-group"> 
      <span class="input-group-addon"><i class="fa fa-globe"></i></span> 
      <input type="url" name="website" class="form-control" placeholder="Website"> 
     </div> 
     <br/> 
     <textarea rows="6" name="message" class="form-control" placeholder="Message"></textarea> 
     <div class="modal-footer" style="border-top: none;"> 
      <input class="btn btn-success" type="submit" value="Send!" id="submit"> 
     </div> 
     </form> 
    </div> 
    </div> 
</div> 

참조 : http://www.w3schools.com/tags/tag_form.asp 당신은 형태 방법과 형태로 개방 태그 동작을 언급해야

Answer 2

. 그런 다음 출력을 확인하십시오. 예를 들어, 폼 구조는 같은

<form name="input" action="demo_form_action.asp" method="get"> 
Username: <input type="text" name="user"> 
<input type="submit" value="Submit"> 
</form>