2017-04-03 277 views
0

我试图使$name,$email$message在一个脚本中验证,而不会使它们看起来像一个错误(使它们都是红色),而不是实际上不正确的。PHP多重验证

她是我使用的代码:

PHP:

<?php 
    $name = $_POST['name']; 
    $email = $_POST['email']; 
    $phone = $_POST['phone']; 
    $visitors_site = $_POST['site']; 
    $message = $_POST['message']; 

    $email_from = '[email protected]'; 
    $email_subject = 'New Contact Submission'; 

    $to = '[email protected]'; 
    $headers = "From:" . $email; 
    $headers = "Contact Submission From: " . $email; 
    $message1 = "Name: " . $name; 
    $message2 = "\n\nEmail: " . $email; 
    $message3 = "\n\nPhone: " . $phone; 
    $message4 = "\n\nTheir Site: " . $visitors_site; 
    $message5 = "\n\nMessage: " . $message; 
    $email_body = $message1 . $message2 . $message3 . $message4 . $message5; 

    if (!filter_var($email, FILTER_VALIDATE_EMAIL) === false) { 
     mail($to, $email_subject, $email_body,$headers); 
     exit(json_encode(array('error' => 0))); 
    } else { 
     exit(json_encode(array('error' => 1))); 
    } 

    if ($name == "") { 
     exit(json_encode(array('error' => 1))); 
    } else { 
     mail($to, $email_subject, $email_body,$headers); 
     exit(json_encode(array('error' => 0))); 
    } 
?> 

AJAX脚本:

var sendEmail = function(){ 
    var url = 'main.php'; 
    $.ajax({ 
     url : url, 
     type : "POST", 
     dataType : "JSON", 
     data : $('#contact-form').serialize(), 
     success : function(response) { 
      if (response.error == 0) { 
       $('#contact-form')[0].reset(); 
       alert('Form submitted successfully. We will contact you asap.'); 
      } else { 
       $('#email-input').css('color', 'red'); 
       alert('ERROR MESSAGE'); 
      } 
     } 
    }) 
    return false; 
} 

HTML:

<div id="contact"> 
     <div class="container"> 
      <form id="contact-form" method="post" onsubmit="return sendEmail()"> 
      <h1>Contact Form</h1> 
      <fieldset> 
       <input placeholder="Your Name" type="text" name="name" id="name-input" required value="<?php echo isset($_POST['name']) ? $_POST['name'] : ''; ?>"> 
      </fieldset> 
      <fieldset> 
       <input placeholder="Your Email Address" type="email" name="email" id="email-input" required value="<?php echo isset($_POST['email']) ? $_POST['email'] : ''; ?>"> 
      </fieldset> 
      <fieldset> 
       <input placeholder="Your Phone Number (optional)" type="tel" name="phone" required> 
      </fieldset> 
      <fieldset> 
       <input placeholder="Your Web Site (optional)" type="url" name="site" required> 
      </fieldset> 
      <fieldset> 
       <textarea placeholder="Type your message here...." name="message" required value="<?php echo isset($_POST['email']) ? $_POST['email'] : ''; ?>"></textarea> 
      </fieldset> 
      <fieldset> 
       <button type="submit" id="contact-submit" name="submit">Submit</button> 
      </fieldset> 
      </form> 
     </div> 
</div> 

回答

3

刚刚发回的列表坏元素,而不是毛毯的错误[R声明

<?php 
// ... 
$errors = []; 
if (!filter_var($email, FILTER_VALIDATE_EMAIL) === false) { 
    $errors[] = "email"; 
} 

if ($name == "") { 
    $errors[] = "name"; 
} 

if ($message == "") { 
    $errors[] = "message"; 
} 

if (count($errors) === 0) { 
    mail($to, $email_subject, $email_body,$headers); 
} 
echo json_encode($errors); 
//... 

然后在您的JS:

success : function(response) { 
     if (response.length == 0) { 
      $('#contact-form')[0].reset(); 
      alert('Form submitted successfully. We will contact you asap.'); 
     } else { 
      for (var i = 0; i < response.length; i++) { 
       $('#' + response[i] + '-input').css('color', 'red'); 
       alert('ERROR MESSAGE'); 
      } 
     } 
    } 

我的JavaScript是一个有点生疏,但应该做的伎俩。

请注意,<textarea>没有value属性,内容作为子文本节点添加。您还应该使用PHP的所有输出中的htmlspecialchars()来防止XSS problems

+0

提交按钮没有做任何事情或代码是错误的。当我按下提交按钮时没有任何事情发生 –

+0

然后开始寻找标准的JS调试。错误控制台等相当肯定没有语法错误在我的代码上面介绍。 – miken32

+1

我看到有两个人,在信息和名字错误后错过了';'。 –

0

在您的JS:

$erro = 0; 
if(document.getElementById("name-input").value == null or document.getElementById("name-input").value == ""){ 
$erro = 1; 
document.getElementById("name-input").style.borderColor = "red"; 
} 
if(document.getElementById("email-input").value == null or document.getElementById("email-input").value == ""){ 
$erro = 1; 
document.getElementById("email-input").style.borderColor = "red"; 
} 
... 
if($erro == 0){ 
//run ajax 
} 

你可以把更多的HTML代码,让隐藏的文本框出现使用。

if(document.getElementById("email-input").value == null or document.getElementById("email-input").value == ""){ 
    $erro = 1; 
    document.getElementById("email-input").style.borderColor = "red"; 
document.getElementById("id_erro1").style.visibility = "visible"; 
    }  

建立在你的HTML:

<fieldset> 
    <input placeholder="Your Email Address" type="email" name="email" id="email-input" required value="<?php echo isset($_POST['email']) ? $_POST['email'] : ''; ?>"> 
    <input type="hidden" name="error_mensage1" id="id_erro1" value="Required field" > 
</fieldset> 

使用CSS来调剂。