Hi all, after a long phase of trials, I finally came up with a way to set SESSION variables with JavaScript and AJAX, in other words, without reloading the page.
But before I explain the procedure, I would like to discuss a little about SESSION variables.
An Introduction
Session variables are used to store information about a single user and this information is accessible throughout the application on all pages. As soon as the values of session variables are unset, no page any longer has access to this information.
Task Description
Since PHP requires data to be submitted to the server for any type of processing, I was not able to set SESSION variables without reloading the page for quite a while. As we have discussed in my earlier article that form data can be validated in PHP without submitting the form and using AJAX, I came up with this procedure for setting SESSION variables likewise.
Code
index.php:
<?php session_start(); ?>
<html>
<head>
<script type='text/javascript'>
function setSession(variable, value) {
xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", "setSession.php?variable=" + variable + "&value=" + value, true);
xmlhttp.send();
}
</script>
</head>
<body>
<?php
if(isset($_SESSION['login']) && $_SESSION['login'] == "true")
echo "Session Active. <a href=\"javascript:setSession('login', 'false')\"><input type='submit' value='De-Activate'></a>";
else
echo "Session Inactive. <a href=\"javascript:setSession('login', 'true')\"><input type='submit' value='Activate'></a>";
echo "<a href=\"index.php\"><input type='submit' value='Re-Load Page'></a>";
?>
</body>
</html>
setSession.php:
<?php
session_start();
if(isset($_REQUEST['variable']) && isset($_REQUEST['value']))
{
$variable = $_REQUEST['variable'];
$value = $_REQUEST['value'];
$_SESSION[$variable] = $value;
}
?>
Components
This small app is comprised of one message box and two buttons.
- A message box is used to display the session status.
- The first button is used to SET / UNSET the SESSION variables.
- The second button is used to RELOAD the page to see the after-effect of the AJAX script.
Functioning
This is the initial state of the session, i.e., Inactive.
The button "Re-load Page" will have no effect on the session status, no matter how many times it is clicked, until the "Activate" button is clicked.
![pic1.jpg]()
Even after the "Activate" button is clicked, the status of the session will not change apparently. But the AJAX running behind the scenes has done what is needed. All we have to do now is to click the "Re-Load Page" button to see the effect of the XMLHttpRequest sent by the browser to the server.
![pic2.jpg]()
The status of the session will change as seen in the picture below, and will not change until the "De-Activate" button is clicked, no matter how many times the "Re-Load Page" is clicked.
![pic3.jpg]()
Kindly come up with suggestions to improve this article.