简体   繁体   English

PHP AJAX / JQuery Bootstrap 3模式在PHP重定向上关闭

[英]PHP AJAX/JQuery Bootstrap 3 Modal Close on PHP Redirect

I am fairly new to PHP and AJAX/JQuery, but I do have a background in Class ASP VBScript. 我对PHP和AJAX / JQuery相当陌生,但是我确实有ASP VBScript类的背景知识。

I have 2 pages: FORM page and PROCESS page. 我有2个页面:“表单”页面和“过程”页面。

FORM PAGE: 表格页:

  • I have a Bootstrap 3 modal login window. 我有一个Bootstrap 3模式登录窗口。
  • Using AJAX to send form data to PROCESS PAGE and a "#Result" div for the reply 使用AJAX将表单数据发送到“处理页面”和“ #Result” div以进行回复
  • Upon successful credentials, I would like to redirect to a "Success" page, but instead, it just places the "Success" page's text in the "#Result" div inside the modal. 获得成功的凭据后,我想重定向到“成功”页面,但是,只是将“成功”页面的文本放在模式内的“ #Result” div中。
  • Upon successful credentials, I would like the login modal CLOSE, and then redirect to the "Success" page. 获得成功的凭据后,我希望登录模式为CLOSE,然后重定向到“成功”页面。

How can I do that? 我怎样才能做到这一点? My code is below. 我的代码如下。

AJAX CODE AJAX代码

<HEAD>
    <script>

    $(document).ready(function() {

    $("#sub").click(function() {

    var user_name = $("#name").val();
    var user_email = $("#email").val();
    var user_pass = $("#pass").val();


    $.post("testloginprocess3.php",{name:user_name,email:user_email,pass:user_pass},function(data){

    $("#result").html(data);

    });

    });

    });

    </script>
</HEAD>

FORM CODE 表格代码

<form id="basicBootstrapForm" class="form-horizontal">

    <div class="form-group">
        <label class="col-xs-3 control-label">Name</label>
        <div class="col-xs-5">
            <input type="text" class="form-control" name="name" id="name" placeholder="Enter name" />
        </div>
    </div>


    <div class="form-group">
        <label class="col-xs-3 control-label">Email address</label>
        <div class="col-xs-5">
            <input type="email" class="form-control" name="email" id="email" placeholder="Enter email" required />
        </div>
    </div>

    <div class="form-group">
        <label class="col-xs-3 control-label">Password</label>
        <div class="col-xs-5">
            <input type="password" class="form-control" name="pass" id="pass" placeholder="Enter password" />
        </div>
    </div>

</form>

        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="submit" class="btn btn-primary" name="signup" value="Sign up" id="sub">Submit</button>

          <div id="result"></div>
        </div>

PROCESS PAGE: 处理页面:

PHP CODE PHP代码

<?php


$con = mysqli_connect("localhost","root","","dbname");

$name = $_POST['name'];
$email = $_POST['email'];
$pass = $_POST['pass'];

$sel = "select * FROM USERS WHERE user_email = '$email' AND user_pass = '$pass'";

$run = mysqli_query($con,$sel);

$check_email = mysqli_num_rows($run);

if($check_email==1){

    Header("Location: testloginsuccess.php");

exit();
}else {

echo "<h4>Not Successful!</h4>";
}


?>

$.post will not follow the redirection you're attempting to do in your PHP code (You can read more about this here ). $.post不会遵循您尝试在PHP代码中进行的重定向(您可以在此处了解更多信息)。 One way you can do it, is return a success or fail string (or even 1 / 0 ), instead of trying to redirect from within the php code, and then use this: 你可以做到这一点的方法之一,是返回一个successfail的字符串(甚至1 / 0 ),而不是试图从PHP代码中的重定向,然后使用此:

$.post("testloginprocess3.php",{name:user_name,email:user_email,pass:user_pass},function(data){
if ( data == 'success' ) {
    //Way #1, redirect the page:
    document.location.href = '/successpage';
    //Way #2, get the success page, and dump it into the $('#result');
    $.get('/successpage', {
       success: function(page) {
          $("#result").html(page);
       }
    }
} else {
    //Login failed, do something here
}
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM