首页 > 解决方案 > 无法使用姓名和电子邮件登录

问题描述

我正在创建一个登录页面,用户可以在其中使用姓名和电子邮件 ID 登录他们的帐户。在此之前,我创建了一个工作正常的注册表单,但我申请登录页面的概念相同,但我无法得到我的结果

问题是我在登录页面中面临的问题,当我只是单击按钮而不填写任何字段时会出现正确的错误,但是当我尝试使用正确的电子邮件 ID 和名称输入详细信息时,它没有登录。

我是这个 ajax 的新手。我应该怎么做才能让它工作?

登录.php

<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8" />
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="script.js"></script>
    <style>
        .error {
            color: red;
            display: none;
        }



        .div1 {
            margin-top: -19px;
            margin-bottom: -25px;
            margin-left: -19px;
        }

        .copy {
            border-radius: 4px;
            padding: 6px 20px;
            border-style: ridge;
        }



        #error_message {
            background: #F3A6A6;
        }

        .ajax_response {
            padding: 10px 20px;
            border: 0;
            display: inline-block;
            margin-top: 20px;
            cursor: pointer;
            display: none;
            color: #555;
        }
    </style>
</head>

<body style="background-image: url(pic.jpg); background-repeat: no-repeat; background-size: cover;">

    <div style="padding-left: 380px; padding-top:80px" class="div1">

        <h2 style="color:#009999">Registration Form :</h2>

        <p>
            <span class="error">All fields are required </span>
        </p>

        <form action="" method="post" id="logForm" enctype="multipart/form-data">

            <span style="color:#0099ff">Name: </span>
            <input type="text" name="name" id="name" class="copy" style="margin-left: 52px" value="" />
            <span class="namee error">Enter name</span>
            <br/>
            <br/>

            <span style="color:#0099ff"> E-mail: </span>
            <input type="text" name="email" id="email" class="copy" style="margin-left: 48px" value="" />
            <span class="emaile error">Enter email</span>
            <br/>
            <br/>

            <input type="button" id="submit" class="submit" name="submit" value="Register" />

            <div id="error_message" class="ajax_response" style="float:left"></div>

        </form>

    </div>

</body>

<script>
    $(document).ready(function () {
        $("#submit").click(function () {
            var error = false;
            var form = document.getElementById('logForm');
            var formData = new FormData(form);

            // Loop through the form data
            for (var p of formData) {
                // Check if the form data is empty
                if (p[1] === '') {
                    // Show the error
                    $('.' + p[0] + 'e').show();
                    error = true;
                }
            }

            // Boolean to prevent AJAX from running in case of an error
            if (error) {
                return false;
            }

            // AJAX Code To Submit Form.
            $.ajax({
                type: "POST",
                url: "success.php",
                data: formData,
                processData: false,
                contentType: false,
                cache: false,
                success: function (data) {
                    if (data['success']) {
                        window.location = 'pannel.php';
                    }
                    else {
                        alert('Invalid Credentials');
                    }

                }

            });

        });
    });
</script>

</html>

成功.php

<?php
    $mysqli  = mysqli_connect("localhost","root","","ajax1");

    $name=$_POST["name"];
    $email=$_POST["email"];

    //Checking is user existing in the database or not
    $query = "SELECT * FROM `users` WHERE name='$name' and email='$email'";
    $result = mysqli_query($mysqli,$query);
    $row1 = mysqli_fetch_array($result);
    $rows = mysqli_num_rows($result);

    if($rows==1){
        $_SESSION['name'] = $name;
        $_SESSION['id']=$row1['userid'];
        // Redirect user to index.php
        header("Location: pannel.php");
    } else {
        $error = " Invalid Name or E-MAIL ";
    }
?>

面板.php

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Bootstrap Example</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <style>
        #success_message{
            background: #CCF5CC;
        }

        .ajax_response {
            padding: 10px 20px;
            border: 0;
            display: inline-block;
            margin-top: 20px;
            cursor: pointer;
            display:none;
            color:#555;
        }
    </style>
</head>
<body>
    <div id="success_message" class="ajax_response" style="float:left"></div>
    <div class="container">
        <br><br><br><br>
        <?php

            $mysqli  = mysqli_connect("localhost","root","","ajax1");
            $query=mysqli_query($mysqli,"select * from `users` where userid='".$_SESSION['id']."'");
            $row=mysqli_fetch_array($query);
            echo 'Welcome - '.$row['name'];

        ?>

        <br>
        <a href="logout.php">Logout</a>
        <br><br>
    </div>

</body>
</html> 

标签: phphtmlajaxmysqli

解决方案


推荐阅读