This is the first application I do that has a DB and PHP, so I'll expect some errors on it, but I couldn't figure what I'm doing wrong with this one.
I'm trying to pass the username from a login HTML form using JS/JQuery, into a PHP file that will verify the username and will store the content from the DB into some $_SESSION variables. In other words, I just want to verify some content from the login page, so I can assign a variable that will hold the entire session, until the user logout.
It works correctly in the login page and I can print the variables to the console, but when I redirect using JS to a second page, after the PHP user verification, but the variables appear empty in the second page.
In the research I did, I found that both pages should have:
<?php session_start(); ?>
But even after that change, the array $_SESSION is empty.
I also confirmed the status of the session:
<?php session_status(); ?> //This result in a 2, meaning that it's working.
And the ID is the same in both pages.
As this is a larger project, I wanted to be sure that anything else was bothering with this, so I've recreated this as a smaller project and I'm still having the problem. This is what I have in the files:
Index.php
I stripped as much as possible and to verify if the problem persisted. Here is the PHP/HTML form and also the JQUERY script that overrides the button functionality to do what I need.
This is the begining of the file:
<?php session_start(); ?>
Then the BODY:
<body class="bg-light">
<div class="flex-row d-flex justify-content-center">
<div class="col-xs-12 col-sm-8 col-md-6 col-lg-4" >
<form class="card" method="post">
<div class="card-body">
<div class="form-group">
<label for="username">User</label>
<input type="text" class="form-control" id="username" placeholder="" autocomplete="username">
</div>
<div class="form-group">
<label for="pssw">Password</label>
<input type="password" class="form-control" id="pssw" placeholder="" autocomplete="current-password">
</div>
<div class="d-flex justify-content-between">
<button class="text-center btn btn-primary" id="btn-login">Enter</button>
</div>
</div>
</form>
<div>
This is the ID of the session: <?php echo session_id(); ?>
</div>
</div>
</div>
JQuery script
$(document).ready(function () {
$("#btn-login").click(function(){
event.preventDefault();
$.ajax({
url: "mylogin.php",
type: "POST",
data: {
name: $("#username").val(),
pssw: $("#pssw").val(),
},
success: function(data){
if (data == true){
$(location).attr('href', '/page2.php');
}
}
});
});
})
Mylogin.php
Here I got the variables from the JQuery script, verify if the user and password are 'a' and then assign the $_SESSION variables.
<?php
$rawUser = $_POST['name'];
$rawPssw = $_POST['pssw'];
if($rawUser == "a" && $rawPssw == "a"){
$_SESSION["username"] = $rawUser;
$_SESSION["another"] = "New Test";
echo true;
} else {
echo false;
}
?>
Page2.php
The purpose of this one is just to print the variables, but they are empty.
Again this is the first line of the file:
<?php session_start(); ?>
And then the body:
<body class="bg-light">
<section class="container" id="login">
<div class="flex-row d-flex justify-content-center">
<div class="col-xs-12 col-sm-8 col-md-6 col-lg-4" >
<h1>This is the second page</h1>
<div>
<?php echo "Session status: " . session_status(); ?>
</div>
<div>
<?php echo "Name: " . $_SESSION["username"]; ?>
</div>
<div>
<?php echo "Role: " . $_SESSION["pssw"]; ?>
</div>
</div>
</div>
</section>
</body>
What I will expect is that the variables like $_SESSION['name'] will hold any value assigned to them by the PHP file, when the second page is loaded. That way I will be able to set up the display of some elements depending on the login of the user.
Thanks.