如何使用ajax验证我的表单

Question

这是我的表格 -

<h1>Form Validation</h1>

<form id="PersonForm">

Name: <input type="text" id="name" name="name"> <br>

Postal Code: <input type="text" id="postal" name="postal"> <br>

Phone Number: <input type="text" id="phone" name="phone"> <br>

Address: <input type="text" id="address" name="address"> <br>

<input type="submit">

</form>

<a href="frontend.html">Refresh</a> 
<a id="InsertDefault" href="">Insert Default Data</a> 
<br>

<ul id="errors"></ul>
<p id="success"></p>

</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript" src="main.js"></script>
<?php
if ($_REQUEST['act'] == 'validate')
{
  $validateData = array();

  if (preg_match("/^[A-Za-z]{3,20}$/",$_REQUEST['name'])) $validateData['name'] = 1;
  else $validateData['name'] = 0;

  if (preg_match("/^[0-9]{10}$/",$_REQUEST['phone'])) $validateData['phone'] = 1;
  else $validateData['phone'] = 0;

  if (preg_match("/^[A-Z][0-9][A-Z][0-9][A-Z][0-9]$/",
  	                          $_REQUEST['postal'])) $validateData['postal'] = 1;
  else $validateData['postal'] = 0;

  if (preg_match("/^[0-9]{3} [A-Za-z]{3,10} Street$/",
  	                          $_REQUEST['address'])) $validateData['address'] = 1;
  else $validateData['address'] = 0;

  echo json_encode($validateData);
}
else echo "Should not happen";

?>
</html>

如何在ajax中使用下面的验证php脚本为我得到的每个错误创建错误列表。因此，如果$validateData[name]，$validateData[postal]为0，我想为每个人创建一条消息并将其放入#error中。

Answer 1

$('form').on('submit', function(event) {
  event.preventDefault();

  var formData = $(this).serialize();

  $.getJSON('frontend.html', formData, function(data) {
    if (!data.address) {
      alert('something wrong!');
    }
  });

});