2015-12-11 2 views
0

Вот мой form-Как использовать Ajax, чтобы проверить мою форму

<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]$/", 
 
    \t       $_REQUEST['postal'])) $validateData['postal'] = 1; 
 
    else $validateData['postal'] = 0; 
 

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

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

 
?> 
 
</html>

Как бы использовать скрипт проверки PHP ниже в AJAX для создания списка ошибок для каждой ошибки я получаю. Так что если $validateData[name], $validateData[postal] было 0, я хочу создать сообщение для каждого и поместить его в #error.

+0

Вы должны использовать js для проверки любого поля, ajax не делает этого. –

+0

Извините, что я могу сказать, как использовать ajax для вызова данных и соответственно установить сообщение об ошибке msg/success msg. – rich

ответ

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

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

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

}); 
Смежные вопросы