使用Ajax与Form.serialize()实现表单验证并获取响应信息-优快云博客

提交表单时用Form.serialize('表单名')

在进行表单数据验证时，需要用Ajax提交表单，提交后在控制器层<greeting.php>进行控制，若不符合条件，返回错误信息至前台

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>Prototype Ajax</title> <mce:script type="text/javascript" src="prototype.js" mce_src="prototype.js"></mce:script> <mce:script type="text/javascript" src="ajax.js" mce_src="ajax.js"></mce:script> </head> <body> <form method="post" action="http://192.168.0.109:8888/magento/greeting.php" id="test-form" name="test-form"> <div id="div1"> <label for="name">Enter your name:</label> <input id="username" name="username" type="text" /> <input id="testbutton" name="testbutton" type="button" onClick="replaceDiv();" value="testbutton"> </div> <div id="divResult" style="color:#FF0000" mce_style="color:#FF0000"></div> </form> </body> </html>

ajax.js

greeting.php

<?php $the_name = $_POST['username']; if ( empty($the_name)){ echo "<p>please input the name</p>"; }else { echo ""; } ?>