Question

我的网站包含几个文件。首先，我有index.html，我的表单详细信息位于。它包含JQuery，因此当用户按下提交时，该站点将填写的信息发送到.php文件，该文件处理所有信息（检查信息，如果信息正确，则将其上传到MySQL数据库）。 .html文件在.css文件的帮助下格式化。

所有这一切都正常。 JQuery，HTML页面或PHP文件中没有错误。

接下来，我想添加一个可以执行以下两项操作之一的功能：

表单有三个必需的文本字段。当用户未能填写其中任何一个，或者无法通过位于.php文件中的电子邮件检查时，我希望看到以红色突出显示错误的文本字段（例如， textfield应该变成红色。）
成功时，表单应该被隐藏，而另一个表单（位于同一位置但通过.css文件隐藏）变得可见。它只包含一个标签，并有文字：“提交成功。”

我对JQuery没有太多经验，所以我很高兴看到调用.php文件的JQuery已经运行了。即便如此，我对如何开始解决上述问题仍毫无头绪。任何人都可以向我提供一个关于如何继续的简单示例或解释吗？

Index.html文件：

<html>
<head>
    <title>Test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" href="resources/assets/styles.css" type="text/css"  />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $("#contactForm").validate({
            debug: false,
            submitHandler: function(form) {
                // do other stuff for a valid form
                $.post('resources/assets/sharedatabase.php', $("#contactForm").serialize(), function(data) {
                 // $('#contactForm').hide();
                  $('#results').html(data);
                });
            }
        });
    });
    </script>

</head>

<div class="form">
<div class="formcontainer">
<form action="" method="post" id="contactForm" name="contactForm">
<fieldset>
And so on...


<?php

if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
...
    }
    */
}

接下来是PHP文件：

if (($_SERVER['REQUEST_METHOD'] == 'POST' && ... $_SERVER['REQUEST_METHOD'] == 'GET')
{
    if ($_SERVER['REQUEST_METHOD'] == 'POST')
    {
        if (!empty($empty_name)) {
            echo json_encode(array(
                'error' => true,
                'msg'   => "Name"
            ));
            exit;
            }
        elseif (!empty($empty_company))  {
            echo json_encode(array(
                'error' => true,
                'msg'   => "Company"
            ));
            exit;
            }
        elseif (!empty($empty_email))     {
            echo json_encode(array(
                'error' => true,
                'msg'   => "Email"
            ));
            exit;
            }
        else    
             {
            echo json_encode(array(
                'error' => true,
                'msg'   => "Something else went wrong."
            ));
            exit;
            }
    }
}
//send
else
{
    mysql_connect("site.nl", "username", "********") or die ('Error: ' . mysql_error());
    mysql_select_db ("databasename") or die(mysql_error());

    //creating values here

    $query="xxxxx";
    mysql_query($query) or die ('Error updating database');
    mysql_close();

    echo json_encode(array(
                'error' => false,
            ));
            exit;
}
?>

Answer 1

在提交数据之前，请检查所需的字段。显示表单错误的最佳方法是简单地向表单项添加“错误”类。

使用CSS，将您的错误类格式化为任何内容（表单字段上的红色背景或其他内容）。在jQuery中，您可以执行以下操作：

// Check form fields for error.
if($('#name').val == ""){
  // Apply an error class.
  $('#name').addClass("error");
}

// On a successful submission, hide the old form and show the new one.
$('#oldForm').hide();
$('#newForm').show();

如果没有看到您的提交代码，我无法帮助您，但您可以进行后端验证并使用AJAX将结果传递给前端。这样您就可以在显示新表单之前验证表单提交是否已进入数据库。

PHP使用JQuery提交表单突出显示错误的文本字段

1 个答案: