Question

我有一个有效的PHP注册表单，可以通过$_POST[]请求检查用户输入。

用户名长度（3-20）
用户名可用性
用户名/ ^ [A-Za-z0-9 _] + $ /
等

我想要一个实时请求来调用来自register.php的错误，而不是让你到一个新页面来显示错误，这样它们就会出现在注册的div中。

<div id="errors">" . $usernameErrors . "</div>

我一直在尝试阅读AJAX，但注意到大多数代码都涉及使用$ _GET []。我需要做些什么才能将当前的表单与AJAX集成？

我当前的基本注册表逻辑：

<form method="post" action="register.php">
    <input type="text" name="username" id="username" required />
    $usernameErrors
</form>

并且register.php已包含所有检查。

Answer 1

如果您使用jQuery，则非常简单。

<script type='text/javascript'>

    $.post('/register.php', 
           {username: $('#username').val()
            // insert values of other fields here
           }, 
           function(response) {
               // update your div with errors
               $('#errors').html(response);
           })

</script>

您应该调用此代码，例如，当用户在注册表单中更改用户名时。它将在后台和更新页面中异步发生。

在这种情况下，您的register.php脚本应该只发出错误，而不是整个页面，否则您将看到意外的结果。： - ）

Answer 2

为了简化ajax，你可以使用jQuery（一个非常强大的JS库）。将jquery ***。js添加到您的项目中并在您的页面上引用它：

 << script type="text/javascript" src="#js/jquery-ui-1.8.16.custom.min.js" />

然后，您创建将进行ajax调用的javascript函数。在ajax调用中，指定要调用的php文件和处理php（回调）返回的函数。在此回调函数上，您将错误消息添加到正文。

function verifyForm(){
 $.ajax({
   type: "POST",
   url: "register.php",
   data: "username=NAME_GOT_FROM_FORM_&location=Boston"
 }).done(function( returned ) { //the callback
   $('#errors').html(returned); // add the string returned to div id=errors
 });
}

Answer 3

所以，问题的关键在于你在问你的问题，似乎是你（正确地）在你的注册表上使用了POST请求，但你的教程都想使用GET。这里讨论了两种方法之间的区别：

http://thinkvitamin.com/code/the-definitive-guide-to-get-vs-post/

如果您实际使用AJAX注册用户（而不仅仅是验证），那么您应该将POSTAX请求作为POST提交。如果你正在使用jQuery，那么答案就已经给出了。如果您不使用jQuery，那么在您的教程中查找XMLHttpRequest对象，并在其中打开＆＃34;打开＆＃34;调用方法（参考此处：http://www.w3.org/TR/XMLHttpRequest/）。该函数的第一个参数是请求方法 - 将其更改为＆＃34; post＆＃34;而不是＆＃34;得到＆＃34;，请求将被视为POST，register.php期望。

话虽这么说，听起来你只是想让AJAX 验证表单。在这种情况下，GET是正确使用的动词 - 您要对AJAX做的只是检查数据库中的数据，而不是实际更改数据。我建议您实际编写一个新的PHP脚本，如validate_registration.php，它只执行register.php中的验证逻辑，然后返回一个JSON错误数组（如果没有错误，它将为空）。您可以根据返回值激活/停用表单提交按钮，如果一切正常，让用户像旧工作流一样提交表单。

这里的tl;博士是你应该阅读使$ _GET和$ _POST不同的内容，然后编写一个特定于AJAX的验证脚本，以便将进程的数据检索部分与数据插入部分。一旦你理解了差异，其余的就应该遵循。

将AJAX添加到正常运行的PHP表单中

3 个答案: