Login Page: Span text error does not appear in table upon PHP prompt & Unable to progress when corre-CodePudding

This post was quite hard to title as I believe the issue I am having is spurred by multiple things.

I am trying to create a login system using HTML and PHP with the requirement of not using a database for username and password validation / storage. I found a good piece of code online that I liked the look of - it fulfills the requirements and works perfectly, so I tried to apply the elements it used in my own coding. However, my version does not offer any indication of working at all.

The original piece of code I found can be seen at this link here:

The image above is of the program I am trying to take elements from - predominantly the "invalid login details" prompt that appears at the top of the page when login is pressed and an incorrect username and password is given. The code for this can be seen here:

<?php session_start(); /* Starts the session */

    /* Check Login form submitted */    
    if(isset($_POST['Submit'])){
        /* Define username and associated password array */
        $logins = array('admin' => '123456','username1' => 'password1','username2' => 'password2');
        
        /* Check and assign submitted Username and Password to new variable */
        $Username = isset($_POST['Username']) ? $_POST['Username'] : '';
        $Password = isset($_POST['Password']) ? $_POST['Password'] : '';
        
        /* Check Username and Password existence in defined array */        
        if (isset($logins[$Username]) && $logins[$Username] == $Password){
            /* Success: Set session variables and redirect to Protected page  */
            $_SESSION['UserData']['Username']=$logins[$Username];
            header("location:index.php");
            exit;
        } else {
            /*Unsuccessful attempt: Set error message */
            $msg="<span style='color:red'>Invalid Login Details</span>";
        }
    }
?>

The code is rather self-explanatory but I am very new to using PHP. The remainder of the file is HTML based, creating the input boxes and button inside of a table, the code of which can be seen here:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PHP Login Script Without Using Database</title>
<link href="./css/style.css" rel="stylesheet">
</head>
<body>
<div id="Frame0">
  <h1>PHP Login Script Without Using Database Demo.</h1>
  <p>More tutorials <a href="http://www.w3schools.in/">www.w3schools.in</a></p>
</div>
<br>
<form action="" method="post" name="Login_Form">
  <table width="400" border="0" align="center" cellpadding="5" cellspacing="1" >
    <?php if(isset($msg)){?>
    <tr>
      <td colspan="2" align="center" valign="top"><?php echo $msg;?></td>
    </tr>
    <?php } ?>
    <tr>
      <td colspan="2" align="left" valign="top"><h3>Login</h3></td>
    </tr>
    <tr>
      <td align="right" valign="top">Username</td>
      <td><input name="Username" type="text" ></td>
    </tr>
    <tr>
      <td align="right">Password</td>
      <td><input name="Password" type="password" ></td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td><input name="Submit" type="submit" value="Login" ></td>
    </tr>
  </table>
</form>
</body>
</html>

Once the user enters one of the 3 pre-defined usernames and passwords, they should be taken to a website called "index.php" which simply gives an affirmation that you have passed verification as you can only access it with the correct credentials - the code of which is here:

<?php session_start(); /* Starts the session */

if(!isset($_SESSION['UserData']['Username'])){
    header("location:login.php");
    exit;
}
?>

Congratulation! You have logged into password protected page. <a href="logout.php">Click here</a> to Logout.

My code is slightly different; I am using a stylised form to display my interface, and I am very much set on keeping it. However, I think this may be the issue as to why I cannot verify usernames and passwords.

My version of the code can be seen below.

<?php
    session_start();

    /* Check Login form submitted */
    if (isset($_POST['Submit'])) {
        /* Define username and associated password array */
        $logins = array('admin' => '123456', 'username1' => 'password1', 'username2' => 'password2');

        /* Check and assign submitted Username and Password to new variable */
        $Username = isset($_POST['Username']) ? $_POST['Username'] : '';
        $Password = isset($_POST['Password']) ? $_POST['Password'] : '';

        /* Check Username and Password existence in defined array */
        if (isset($logins[$Username]) && $logins[$Username] == $Password) {
            /* Success: Set session variables and redirect to Protected page  */
            $_SESSION['UserData']['Username'] = $logins[$Username];
            header("location:index.php");
            exit;
        } else {
             /*Unsuccessful attempt: Set error message */
            $msg = "<span style='color:red'>Invalid Login Details</span>";
         }
     }
?>

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>U33 DATABASING</title>
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css">
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <link rel="stylesheet" href="https://www.w3schools.com/lib/w3-theme-black.css">
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <!-- Navbar -->
    <div >
        <div >
            <a 
                href="javascript:void(0);" onclick="openNav()"><i ></i></a>
            <a href="http://localhost/webserver/navigationpage/navpage.html"
                ><i ></i>U33</a>
            <div >
                <button  title="Notifications">Important Links <i
                        ></i></button>
                <div >
                    <a href="http://localhost/webserver/cvwebpage/cv.html"
                        >CV</a>
                    <a href="http://localhost/webserver/phplogin/login.php"
                        >Literary Database</a>
                    <a href="#" >Submit an Article</a>
                </div>
            </div>
        </div>

        <!-- Navbar on small screens -->
        <div id="navDemo" >
            <a href="http://localhost/webserver/cvwebpage/cv.html" >CV</a>
            <a href="http://localhost/webserver/phplogin/login.php" >Literary
                Database</a>
            <a href="#" >Submit an Article</a>
        </div>
    </div>


    <div >
        <h1>Literary Database Login</h1>

        <table width="300" height="20" border="2px solid black" align="center" cellpadding="4" cellspacing=1 >
            <?php if(isset($msg)){?>
            <tr>
                <td colspan="2" align="center" valign="top"><?php echo $msg;?></td>
            </tr>
            <?php } ?>
        </table>

        <form action="" method="post" name="Login_Form">
            
            <label for="Username">
                <i ></i>
            </label>
            <input type="text" name="Username" placeholder="Username" id="Username" required>
            <label for="Password">
                <i ></i>
            </label>
            <input type="password" name="Password" placeholder="Password" id="Password" required>
            <input  type="submit" value="Login">

        </form>


    </div>
</body>

</html>

I'm not certain what's wrong here at all; I have assigned the same variable names to my input boxes as would be if they were inside of the table in the other program, but that hasn't seemed to do anything. Additionally, regardless of what is inputted into the two text boxes, the "invalid login details" text does not appear in the that I created - which is a table within the form.

An image of my product can be seen here:

As you can see, there is a grey outlined box above the username field - this is empty and should remain so until the user enters an incorrect username/password. Once this occurs, the red text should appear inside of the box - which I thought I had done when calling upon the $msg function in the else statement of the PHP at the top of the file, but that doesn't seem to work.

Also, when entering the correct information into the username and password field, I am not taken to the index.php file. Just for assurance, here is an image of the index.php page when the username and password are correct:

Maybe this is an issue of variable scope? I'm not really sure and would love any help I can get to figure this out.

Thank you for your time and I look forward to seeing the responses I get.

CodePudding user response：

You are missing the name attribute on the submit button.

<input  type="submit" value="Login">

should be

<input  type="submit" value="Login" name="Submit">

Without it the very first isset fails and it just spits out the html as if you hadn't done anything.