0

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

所有这些都正常工作。JQuery、HTML 页面或 PHP 文件中没有错误。

接下来，我想添加一个可以做以下两件事的功能：

  • 该表单具有三个必需的文本字段。当用户未能填写其中任何一个，或未能通过位于 .php 文件中的电子邮件检查时，我希望看到发生错误的文本字段以红色突出显示（例如文本字段应变为红色）。

  • 成功后，表单应该被隐藏，而另一个表单（位于同一位置但通过 .css 文件隐藏）变得可见。这仅包含一个标签，并具有以下文字：“提交成功。”

我对 JQuery 不太熟悉，所以我很高兴看到调用 .php 文件的 JQuery 已经工作了。即便如此，我对如何开始处理上述问题一无所知。谁能给我一个简单的例子或解释如何继续？

索引.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;
}
?>
4

1 回答 1

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 将结果传递给前端。这将允许您在显示新表单之前验证表单提交是否已进入数据库。

于 2012-09-10T14:48:50.250 回答