使用ajax转换旧登录

converting old login using ajax

本文关键字:登录 转换 ajax 使用      更新时间:2023-09-26

我是一个新的web开发人员目前正在使用登录系统的网站上工作,不使用任何ajax,我想转换现有的框架,利用ajax,如果这是可能的。目前,它只是一个已经在调用动作的表单:

<form action="<?=$url_root?>/controllers/UserController.php" method="post" name="login_form">
<input type="hidden" name="action" value="login" />
<input type="hidden" name="path_requested" value="<? if(isset($GLOBALS['path_requested'])) { echo $GLOBALS['path_requested']; } ?>" />
<p class="field"><?if(isset($invalid)){?><span class="invalid">Invalid login! Try again.</span><?}?>E-mail:</p>
value="<? if(isset($email)) { echo $email; } ?>" />
<p class="field"> Password:</p>
<input type="password" name="password" onKeyPress="return submitenter(this,event)" tabindex="2"/>
<input class="image" type="image" src="<?=$url_root?>/style/images/img_button_submit.jpg" name="Submit" value="Submit" />

<!--<input type="submit" class="button"/>-->
</form>

现在,表单提交给UserController.php并显示一个空白屏幕,如果成功,则登录,如果失败,则刷新回某个页面。

我想转换这个ajax调用后台的UserController.php,然后返回它的响应。

我开始用一个简单的形式来代替上面的形式:

<form method="post" name="login_form">
<span class="throw_error"></span>
<p class="field">E-mail:</p>
<input type="text" name="email" id="email" />
<p class="field">Password:</p>
<input type="password" name="password" id="password"/><br><br>
<input class="image" type="image" src="<?=$url_root?>/style/images/img_button_submit.jpg" name="Submit" value="Submit" />

<!--<input type="submit" class="button"/>-->
</form>
这是我的ajax脚本:
<script type="text/javascript">
    $('#login_form').submit(function() {
       checkLogin();
    });
    function checkLogin()
    {
         $.ajax({
            url: "../controllers/UserController.php",
            type: "POST",
            data: {
                email: $("#email").val(),
                password: $("#password").val()
            },
            success: function(response)
            {
                if(response == 'true')
                {
                    window.location.replace("main.html");
                }
                else
                {
                    alert('bad login');
                }
            }
        });
    }
    </script>

我不确定如何从UserController.php返回响应到ajax调用的成功或失败。我不确定使用旧代码是否也需要彻底检修。

HTML

<form id="login_form">

JS

$(document).ready(function() {
    $('#login_form').submit(function() {
        checkLogin();
        return false;
    });
});

AJAX(如果路径是http://example.com/example/controllers/UserController.php)

url: "/example/controllers/UserController.php",