簡體   English   中英

驗證后如何清除表格?

[英]How can I clear a form after validation?

點擊提交並驗證后,我無法清除表格。 此表格分為三個部分。 HTML,JS和PHP。 表單正確提交並驗證,但之后未清除字段。 我嘗試了多種方法來清除它,但是我沒有運氣。

    <form id="formR" name="formR">
    <input type="hidden" name="q" id="q" value="formR">
    <input type="hidden" name="zip" id="zip" value="12345">
    <p>
    <label>
    <input name="Name" type="text" placeholder="Name" id="name" onBlur="if(this.value=='') { this.value='Your Name' }" onFocus="if(this.value=='Your Name') { this.value='' }" value="Your Name"> 
    </label><br>
    <label>
    <input name="email" type="text" placeholder="E-mail" id="email" onBlur="if(this.value=='') { this.value='E-mail' }" onFocus="if(this.value=='E-mail') { this.value='' }" value="E-mail"> 
    </label><br>
    <label> 
    <input name="phone" type="text" placeholder="Phone Number" id="phone"  maxlength="10" onBlur="if(this.value=='') { this.value='Phone Number' }" onFocus="if(this.value=='Phone Number') { this.value='' }" value="Phone Number">
    </label><br>
    </p>
    <input name="quote" id="quote" type="hidden" value="Recreational" />
    <input name="Submit" type="button" value="Submit" onClick="validateForm()">
    </form>
  function isNumberKey(evt)
  {
     var charCode = (evt.which) ? evt.which : event.keyCode
     if (charCode > 31 && (charCode < 48 || charCode > 57))
        return false;

     return true;
  }

  function updateZip ()
  {
    document.getElementById('zip').value = document.getElementById('zipcode').value;
  }

  function validateForm()
  {
    if(document.getElementById('name').value.length > 0 && document.getElementById('email').value.length > 0 && document.getElementById('phone').value.length > 0 && document.getElementById('name').value != 'Name' && document.getElementById('email').value != 'E-mail' && document.getElementById('phone').value != 'Phone Number')
    {
        if((document.getElementById('email').value.indexOf('@') != -1) && (document.getElementById('email').value.indexOf('.') != -1))
            {
            subForm();
            return true;
        }
        else    
        {
            alert('Please enter a valid email address!');
            return false;
        }
    }
    else
    {
    alert('Please enter all your information in first!');
    return false;
    }
  }

  function subForm()
  {

    //var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone;  //alert (dataString);return false;  
$.ajax({  
type: "POST",  
url: "sendEmail2.php",  
data: $("#formR").serialize(),
success: function(msg) { 
showNotification({
message: msg,
type: "success",
autoClose: true, 
duration: 10
})
}
});  
return false; 
$( "formR" )[ 0 ].reset(); 
}   

另外,還有一個關聯的php代碼,所以我不確定這是否是表單未清除的原因。 也許我把它放錯了地方?

<?php
//Email sender...
//Config
`$emailTo = 'preintel@gmail.com';
$ip = $_SERVER['REMOTE_ADDR'];
if($_POST['q'] == 'formR')
{
//verify ip address:
$validateIP = true;
try{
$cont = file_get_contents("logs/formR.txt");
$lines = explode("\n",$cont);
foreach($lines as $s)
{
    if(strpos($s,$ip) !== false)
    $validateIP = false;
}

if($validateIP == false)
echo "A request has already been made with IP address: ".$ip.". Please wait until we contact you!";
}
catch(Exception $e)
{
    echo "An error occurred, please make sure your ip address is not masked!";
}

$name = $_POST['Name'];
$email = $_POST['email'];
$phone = $_POST['phone'];
$quote = $_POST['quote'];
$headers = "From: " . strip_tags($_POST['email']) . "\r\n";
$headers .= "Reply-To: ". strip_tags($_POST['email']) . "\r\n";
//$headers .= "CC: susan@example.com\r\n";
$headers .= "MIME-Version: 1.0\r\n";
$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";

$subject = "New Quote Request From: ".$name;
$message = "<h3>A quote has been requested:</h3><hr/>Name: ".$name."<br/>Email: ".$email."<br/>Phone Number: ".$phone."<br/>Quote: ".$quote."<br/><br/><br/>Request Time: ".date("Y-m-d H:i:s")."<br/>Requesting IP: ".$ip;
if($validateIP)
{
    if(mail($emailTo, $subject, $message, $headers))
    {
        echo "Thank you, your quote will be processed! We will contact you shortly.";
        //Write ip to log file...
        $file = 'logs/formR.txt';
        $current = file_get_contents($file);
        $current .= $ip." - ".date("d/m/y : H:i:s", time())."\n";
        file_put_contents($file, $current); 
    }
    else
    echo "An error occurred sending your email, please try again later!";
}
}
else
echo "Oops! An error occurred... Please email us at: ".$emailTo;
?>

您應該這樣做:

$("#formR" )[0].reset(); //<--forgot the # because that's the form's ID

你可能不需要[0]中: $("#formR" )[0].reset();

並將該行放在return語句之前-您當前在它之后。

這是假設您有某種可以顯示“重置”功能的jquery插件-我在核心jquery庫中從未見過。

驗證並提交表單后,如果要將值重置為其默認值(它們最初具有的值),則可以簡單地手動將php變量設置為這些默認值。 因此,如果這些值最初是空的,請將變量設置為“”,然后將其重新附加到表單。
如果您使用AJAX提交表單,則可以使用JavaScript清除內容,也可以只刷新頁面。 那會解決的。
除非您有特定的問題,否則重置表格不會造成任何麻煩。

希望這可以幫助。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM