在 html 中显示错误消息答案

【问题标题】：Display error messages in html在 html 中显示错误消息
【发布时间】：2011-11-25 08:33:26
【问题描述】：

我想在 html 中显示警告消息。此代码显示两个名为“company”和“name”的文本框。 con.php 连接到数据库并插入信息。但是，如果我什么都不输入，那么这些值仍会以null 的形式存储在数据库中。我希望用户知道他不应该通过显示一些消息将字段留空，并且如果给定公司已经存在于数据库中，则还应该出现警告。我该如何实现？

  <html>
   <head>
 <title>store in a database</title>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   </head>
    <body>
   <h2>company  Store</h2>
   <form name="form1" method="post" action="con.php">
      <p>company:<input type="text" name="company">
          <br/>
          <br/>
          <br/>
          Name: <input type="text" name="name" size="40">
          <br/>
          <br/>
          <br/>

          <input type="submit" value="Save">
          <input type="button" onclick="window.close()" value="cancel">
  </form>
</body>

【问题讨论】：

你不能用（纯）html做到这一点；如果 JavaScript 是一个选项，那么这很容易，或者可以（并且应该）使用您用来填充数据库的任何脚本语言在服务器端进行检查。
HTML 5 有一些验证属性。但它们并不是真正的喷气式飞机。正如 David Thomas 所说，您也必须检查服务器端的数据。 @David Thomas：他已经在使用 javascript，请查看取消按钮。

标签： php html validation

【解决方案1】：

虽然没有 JavaScript 就无法生成警报消息，但您可以利用 HTML5 的 placeholder 属性来通知用户此消息：

<input type="text" placeholder="You must enter something in this field"! name="whatever" id="whatever" />

并将其与 JavaScript 结合起来：

var inputElem = document.getElementById('whatever');
var form = document.getElementsByTagName('form')[0];

form.onsubmit = function(){
    if (inputElem.value = '' || inputElem.value.length < 1){
        alert('You must enter some actual information');
        return false;
    }
};

但是，用户可以通过 Firebug、Web Inspector、Dragonfly 编辑 JavaScript...或者通过简单地创建一个新的 html 文件并将表单从form 元素的action 属性提交到相同的源.因此，您的表单处理脚本必须在服务器和客户端上进行清理和检查；客户端检查是为了方便用户（防止不必要的页面重新加载、提交等），它不是安全功能，不应使用, 或错误的，因此。

【讨论】：

【解决方案2】：

如果您想在同一页面上执行此操作，最好的方法是使用Ajax。你需要阅读一些关于它的教程。在这里解释起来并不容易。

如果您可以重新加载或重定向到其他页面，您应该将提交的表单值与PHP 脚本中的数据库中的值进行比较，该脚本是从表单提交（操作网址）重定向的。如果值不匹配且不为空，则将值存储到数据库并重定向到公司列表或“公司成功创建”消息页面等页面。如果值与旧记录匹配或为空，则使用标志（例如 form.php?error=1 等）重定向回同一表单页面并显示正确的错误消息。

您还可以使用JavaScript 进行即时警报。但是您应该始终在PHP 端进行相同的检查，因为JavaScript 可以在浏览器中禁用。

【讨论】：

【解决方案3】：

在 con.php 中，您应该进行数据验证并返回标记（或重定向到描述错误的页面）。

因此，请检查空字段，如果存在则将用户重定向到一个页面，说明字段不能为空（并可能允许他们输入新值）。

如果输入的数据正常，请检查数据库是否存在重复项，如果存在重复项，则将用户重定向到说明公司已经存在的页面（并可能再次允许用户更正数据）。

【讨论】：

【解决方案4】：

你不能只使用 HTML。

您需要添加表单验证（以防止出现空字符串），HTML5 表单验证可以为您完成（检查http://www.broken-links.com/2011/03/28/html5-form-validation/），但并非所有浏览器都支持它，因此您需要使用 JavaScript 来验证表单.

有一些 JavaScript 库可以使用旧浏览器并使其表现得像支持 HTML5 的浏览器（检查 http://www.matiasmancini.com.ar/jquery-plugin-ajax-form-validation-html5.html）。

您还需要检索数据库中已有的公司，并根据用户输入检查它们，并在需要时提醒他。

除此之外，您需要先验证 PHP 中的数据，然后再将其插入数据库（例如检查空字符串）。

【讨论】：