jQuery/Ajax&;PHP表单处理设计


jQuery/Ajax & PHP form processing design

当我开发需要用PHP处理的表单时,我倾向于将表单和PHP放在一个文件中,例如signup.PHP,并使用$_GET方法来确定我需要对表单做什么。

例如,如果请求/site/signup.php,那么我知道我需要显示HTML表单,但如果/site/ssignup.php?action=newsignup被请求(通过html表单提交),然后我知道我需要处理它。

我对这种方法很满意,因为这意味着我需要维护更少的文件,并且所有交互都在一个文件中,这使得跟踪问题更容易(此外,我讨厌在处理数据时不断从一页重定向到另一页的网站。)

我要做的一个粗略的例子是:

<?php
if (isset($_GET['action'] && $_GET['action'] == "newsignup")
{
   $name = cleanInput($_POST['name'];
   $email = cleanInput($_POST['email'];

   if(validUserName($name)== TRUE)
   {
      // do processing here
   } else {
      // fail processing here
   }
   if(validEmail($email)== TRUE)
   {
      // do processing here
   } else {
      // fail processing here
   }
   // Do database stuff etc
   // Display success message 
} else {
  // Not $_GET so must be a new sign-up. Display html form

    <form id="signup" action="signup.php?action=newsignup" method="post">
       <input type="text" name="name" id="name" />
       <input type="text" name="email" id="email" />
       <input type="submit" id="submit" value="Submit" />
    </form>
}

现在,我开始使用jQuery/Ajax在客户端进行验证,以便在用户完成表单时提供反馈,当数据输入到表单中的文本框中时,使用keyup事件实时验证数据,将该文本框发布到.php脚本中进行验证。要做到这一点,我使用jQuery Post:

function name_check(){  
var username = $('name').val();
    if(name == "" || name.length < 4){
        $('#name').css('border', '3px #CCC solid');
        $('#text').text('');
    }else{
            $.post('jquerysignup.php', { name: $('#name').val()}, function(response) {
                $('#phpout').html(response['message']); // return an error string if exists
                if(response['returnval'] == 0){
                    $('#name').css('border', '3px green solid');
                    $('#submit').fadeIn('slow')
                } else if (response['returnval'] == 2){
                    $('#name').css('border', '3px red solid');
                    $('#submit').fadeOut('slow')
                } else {
                    $('#name').css('border', '3px red solid');
                    $('#submit').fadeOut('slow')      
                }
            }, 'json');
    } //
}

jquerysignup.php文件仅包含php函数validUserName和validEmail。

我现在有两个.php文件,一个用于服务器端验证,另一个用于客户端。我想保留客户端和服务器端验证,但不想保留包含重复功能的多个文件。

我一直在努力寻找或提出一个集成的解决方案,我知道必须有更好的方法来做到这一点,但我找不到任何例子来处理这个特定的问题。

我真的很感激在最佳实践/解决方案方面提供一些指导。

我同意你不完全依赖javascript验证的决定,因为黑客总是可以将其作为浏览器的属性。。。

唯一需要服务器端工作的验证是唯一性验证。。。为此,您必须使用Ajax。。

为什么不在同一个文件中。。

ajax请求的作用是将请求发送到一个服务器脚本,该脚本包含数据,并在数据库检查验证后回复结果。。

您可以从javascript调用相同的文件。。为什么不呢?

只需设置

if(isset($_POST['ajax_variable_name']))
{
    your validation logic goes here and echo corresponding result..
}

现在你已经使用jquery验证了你的用户凭据,他已经提交了表格。

然后也让用户进入同一页面。。

只需给你的提交按钮一个名称,比如name="submit"

在这个页面的顶部

像你早些时候做的那样

if(isset($_PoST['submit']))
{
if correct validation make changes in database and redirect him to success page...
}

再次:

if( check if ajax request is made here)
{
---echo result... 
}
else
{
--whole page--
First form submit check if success then redirect
Then normal form
}

通过这种方式,它将检查您的jquery脚本,并仅在设置好后处理它们。。。如果没有,它会检查表单是否提交,如果一切都正确,它会重定向而不显示表单,否则只显示错误。。如果表单没有提交,或者由于错误,我们没有重定向,它将显示表单。

jquery验证脚本的其他部分还有一件事可以放在Tags的同一页上。。