Php 成功提交时隐藏表单

我有一个表单，当它成功提交并显示一条消息时，我想将其隐藏起来（该消息已在运行）。现在唯一的缺点是表单被滑动切换，即使表单没有正确提交。提交表单时存在一些问题。这很奇怪。有时，如果不是所有字段都已填写，它会提交，有时则不会。我认为php和jquery之间的合作在这里并不完美

感谢帮助give，我成功地将以下代码组合在一起：

PHP:

HTML+javascript元素：

<div id="feedback-form">

    <script>                    
        function submitmyform(){
            data=$('#myform').serialize();
                $.ajax({
                url: "scripts/form-testimonial.php",
                type:'POST',
                data:data,
                async:false,
                dataType:'html',
                success: function(msg){

                    $('#response_goes_here').html(msg);
                    $("#feedback-form").slideToggle(200);
                }
            });

        }
    </script>

    <form action="" id="myform">

        <ul>
            <li>    <label for="name">Name</label>              <input id="namef3" name="name" type="text" placeholder="Name" class="required"/>            
          </li>
            <li>    <label for="email">E-mail</label>           <input id="emailf3" name="email" type="text" placeholder="E-mail" class="required"/>        
          </li>
            <li>    <label for="company">Company</label>        <input id="companyf3" name="company" type="text" placeholder="Company (if applicable)" />   
          </li>
            <li>    <label for="msg">Message</label>            <textarea id="msgf3" name="msg" cols="43" rows="8" placeholder="Your feedback" class="required"></textarea> 
          </li>
        </ul>
        <button type="button" class="submit" onClick="submitmyform();">Send your feedback</button>
    </form>
</div> <!-- id="feedback-form" -->
    <div id="response_goes_here"></div>

函数submitmyform（）{
数据=$（'#myform'）。序列化（）；
$.ajax({
url:“scripts/form essential.php”，
类型：'POST'，
数据：数据，
async:false，
数据类型：'html'，
成功：功能（msg）{
$（'response_goes_here'）.html（msg）；
$（“#反馈表”）。幻灯片切换（200）；
}
});
}

名字

电子邮件

公司

信息


发送您的反馈

还有一个验证脚本（对不起，我知道它很长）：

$（函数（）{
var addErrorMessage=函数（字段）{
var err=$（document.createElement（'p'））.addClass（'validation-error'）.text（'Required field'）；
field.addClass（'err'）。在（err）之后；
},
clearError=函数（）{
var t=$（本）；
if（t.hasClass（'err'））{
t、 removeClass（'err'）；
t、 next（'p'）.empty（）.remove（）；
}
},
isEmpty=函数（str）{
返回修剪（）长度<1；
},
isValidEmail=函数（str）{
变量regexp=/^（[a-zA-Z0-9\.-\+]）+\@（[a-zA-Z0-9\-]）+）+（[a-zA-Z0-9]{2,4}）+$/；
返回regexp.test（str）；
},
fieldsValidate=false；
函数validateForm（e）{
log（'validate start'）；
var requiredFields=jQuery（e）.find（'.required'）；
var email=jQuery（e）.find（'input[name=“email”]”）；
var emailValue=email.val（）；
log（emailValue+mail val'）；
fieldsValidate=true；
//检查必填字段是否为空
必填字段。每个（函数（）{
var t=$（本）；
if（isEmpty（t.val（）））{
fieldsValidate=false；
如果（！t.hasClass（'err'））{
附加错误消息（t）；
}
}
});
//检查电子邮件是否有效
log（isValidEmail（emailValue）+“有效吗”）；
如果（！isValidEmail（emailValue））{
fieldsValidate=false；
如果（！email.hasClass（'err'））{
补充信息（电子邮件）；
console.log（'mail NOT ok'）；
}
}
console.log（fieldsValidate+“返回前”）；
返回字段验证日期；
};
$（'input，textarea'）.blur（clearError）；
$（“.submit”）。单击（函数（）{return validateForm（this.form）}）；

我已经做了一个测试，但是它不包含实际的php（我不知道我是否可以在JSFIDLE中使用php）

问题是：使用此页面上的表单：（请向下滚动并单击添加新证明-出现以下问题：

在没有填写所有字段并单击“提交”后，它会向上滑动表单（我希望只有在表单填写正确时，它才会向上滑动）

当我删除slideToggle脚本时-即使它没有正确填写，并且您再次单击ADD NEW TSTIMONIAL…以发送此表单，但它不会填写，那么它将发送实际消息（空），因此它会忽略验证表单。若要测试此实例，请在“消息”字段中放置任何内容，并将其他内容保留为空。它将忽略这些内容，并在单击“提交”按钮两次后发送表单

原因可能是什么？问题在哪里？奇怪的情况，很难用更简单的方式解释。感谢您在这方面的支持。

而不是

 echo "<h6>Message sent successfully. Thank you for your feedback.</h6>";

然后在jquery脚本中：

success: function(msg){
               if(msg == 'sent'){
                        $('#response_goes_here').html('Message sent successfully. Thank you for your feedback.');
                        $("#feedback-form").slideToggle(200);
                    } else {
                     $('#response_goes_here').html('Error. Mail not sent!');
                   }

}

还有这个

 if(!$_POST['msg'] || $_POST['name'] || $_POST['email']){
                 echo "<h6>Error sending e-mail<h6>";
                 exit;
          }

if（！$\u POST['msg']|$\u POST['name']|$\u POST['email']））{
回显“发送电子邮件时出错”；
出口
}

每次完成姓名或电子邮件时都将返回错误：D.重试

if(empty($_POST['msg']) || empty($_POST['name']) || empty($_POST['email'])){
   echo "<h6>Error sending e-mail<h6>";
                     exit;
}

if（空（$_POST['msg']）| |空（$_POST['name']）| | |空（$_POST['email']））{
回显“发送电子邮件时出错”；
出口
}

有很多错误：

将

$（函数（）{

替换为

（函数（$）{

不要在单击按钮时调用

submitmyform

替换

<button type="button" class="submit" onClick="submitmyform();">Send your feedback</button>

使用以下代码，然后重试：

$(".submit").click(function() { 
    $("#myform").submit();
});

$("#myform").submit(function() {
    if (validateForm(this)) {
        console.log('valid');
        submitmyform();
    } else {
        console.log('invalid');
    }
    return false;
});

更新的PHP代码：

if (empty($_POST['msg']) || empty($_POST['name']) || empty($_POST['email'])) {
    echo "<h6>Error sending e-mail<h6>";
    exit();
}
$receip = "office@avehire.co.uk";
$subj = "Testimonial";
$bodymsg = "Name: " . $_POST['name'] . "\n"
        . "Company: " . $_POST['company'] . "\n"
        . "Email: " . $_POST['email'] . "\n"
        . "Message: " . $_POST['msg'] . "\n";

$email = $_POST['email'];
if (mail($receip, $subj, $bodymsg, 'From: Contact <' . $email . '>')) {
    echo "<h6>Message sent successfully. Thank you for your feedback.</h6>";
} else {
    echo "<h6>Error occurred while sending email.</h6>";
}

if（空（$_POST['msg']）| |空（$_POST['name']）| | |空（$_POST['email']））{
回显“发送电子邮件时出错”；
退出（）；
}
$receip=”office@avehire.co.uk";
$sub=“证明”；
$bodymsg=“Name:”.$\u POST['Name']。“\n”
“公司：”.$\u POST[“公司”]。“\n”
“电子邮件：”.$\u POST['Email']。“\n”
“消息：”.$\u POST['msg']。“\n”；
$email=$_POST['email']；
如果（邮件（$receip、$subb、$bodymsg，'From:Contact'））{
echo“消息已成功发送。感谢您的反馈。”；
}否则{
echo“发送电子邮件时出错。”；
}

它在这里正确地进行了验证！有什么问题吗？在我将php+jquery添加到html之上之前，它确实正确地进行了验证。验证脚本本身也正确地进行了验证。演示网站显示了这个问题。脚本本身看起来不错。我不知道有什么问题。谢谢。我已经尝试过了，但它实际上并没有滑动到表单a上由于某些原因，lso没有发送它。也没有显示成功发送的消息…调整代码。消息是php脚本返回的消息。您必须检查它。在您的位置，我将创建一个函数，而不是php中的回声，我将重新

<button type="button" class="submit" onClick="submitmyform();">Send your feedback</button>

<button type="button" class="submit">Send your feedback</button>

$(".submit").click(function() { return validateForm(this.form) });

$(".submit").click(function() { 
    $("#myform").submit();
});

$("#myform").submit(function() {
    if (validateForm(this)) {
        console.log('valid');
        submitmyform();
    } else {
        console.log('invalid');
    }
    return false;
});

if (empty($_POST['msg']) || empty($_POST['name']) || empty($_POST['email'])) {
    echo "<h6>Error sending e-mail<h6>";
    exit();
}
$receip = "office@avehire.co.uk";
$subj = "Testimonial";
$bodymsg = "Name: " . $_POST['name'] . "\n"
        . "Company: " . $_POST['company'] . "\n"
        . "Email: " . $_POST['email'] . "\n"
        . "Message: " . $_POST['msg'] . "\n";

$email = $_POST['email'];
if (mail($receip, $subj, $bodymsg, 'From: Contact <' . $email . '>')) {
    echo "<h6>Message sent successfully. Thank you for your feedback.</h6>";
} else {
    echo "<h6>Error occurred while sending email.</h6>";
}