In my database I have a dateandtime field in one of the tables, which correctly displays the date and time from the database for the row I want. As I will possibly get users from many different countries I will need to allow a user to select their timezone so that the time in the time and date in the dateandtime field will be changed to their timezone across all pages of my site.
I am able to successfully allow the user to type in a input field the time zone such as "+3:00" and enter a date such as "24/07/2017" into another input field, and when the user clicks the Search button the timezone conversion will be successful. This is not ideal though as it means everytime the user goes to another page on the site and goes back to the search by date page they have to input the timezone e.g. "+3:00" again.
I was thinking that a session could be used to achieve what I need but when I tried using a session to remember the timezone value when I went back to the page the time would no longer be in the timezone I had previously inputted.
To summarise, what I am trying to achieve is that I would like the user to be able to select their timezone and for any dates and times displayed on the webpages from the database will be changed to the users selected timezone, and if the user was to go off the page then their timezone will be remembered if they were to go back to the previous page.
An example site that shows what I am trying to achieve successfully is below
A site which has the functionality with timezones I am attempting to achieve
As you can see on that site if I select timezone, it successfully changes the timezone, and if I was to select another section of the site it would remember the users timezone and update the date and time to reflect the timezone changes. It seems after inspection that that site uses a cookie to remember the timezone value, would I be able to use cookies to achieve this type of functionality on my site?
Below is the code I have that successfully changes the timezone when the user inputs a timezone value e.g. "+3:00" and date into the corresponding input fields but will not remember timezone option.
<?php
include './config.php';
include './header.php';
$timezone = trim($_GET["timezone"]);
$keyword = trim($_GET["keyword"]);
if ($keyword <> "" && $timezone <> "" ) {
$sql = "SELECT f.hometeam, f.awayteam, f.sport, f.competition,
DATE_FORMAT(CONVERT_TZ(f.dateandtime, '+00:00','$timezone'), '%M %e, %Y %r') AS dateandtime,
Group_concat(s.name SEPARATOR ',') name,
Group_concat(x.channelid_fc SEPARATOR ',') channelid_fc
FROM footballfixtures f
LEFT JOIN fixturechannels x
ON x.matchid_fc=f.matchid
LEFT JOIN satellite s
ON x.channelid_fc=s.channelid
WHERE DATE(dateandtime) = STR_TO_DATE('$keyword', '%d/%m/%Y')
GROUP BY f.hometeam, f.awayteam, f.sport, f.competition, f.dateandtime
ORDER BY f.dateandtime ";
$stmt = $DB->prepare($sql);
$stmt->bindValue(":keyword", $keyword."%");
$stmt->bindValue(":timezone", $timezone." %");
$stmt->execute();
} else {
$sql = "SELECT 1 from dual";
$stmt = $DB->prepare($sql);
}
$stmt->execute();
?>
<html>
<head>
</head>
<body>
<div class="container mainbody">
<div class="mainpagetitle">
<h11>Sports Schedule</h11> <br> <br>
<p>We aim to provide you with sports schedule in an easy to view format</p> <br> <br> <br> <br> <br>
<form class="form-inline">
</div>
<div class="clearfix"></div>
<div class="col-xs-12">
<img src="css/calendar.png" class="img-responsive" />
<div id=class="container-fluid">
<div class="row">
<h2>Search by Date</h2> <br>
<p> Please Enter Date </p>
</div>
</div>
</div>
<div class="searchform">
<form action="bydate.php" method="get" >
<label class="col-xs-12" for="timezone";>
<select name="timezone" id="timezone">
<option value="+1:00">+1:00</option>
<option value="+2:00">+2:00</option>
<option value="+3:00">+3:00</option>
<option value="+4:00">+4:00</option>
</select>
</label>
<div class="searchform">
<form action="bydate.php" method="get" >
<label class="col-xs-12" for="keyword";>
<input type="text" value="<?php echo htmlspecialchars($_GET["keyword"]); ?>" placeholder="Enter Team Name" id="" class="form-control" name="keyword">
</label>
<button class="btn btn-info">search</button>
</form>
</div>
</div>
<div class="clearfix"></div>
<div class="container">
<div class="row">
<div class="tables">
<div class="col-xs-12">
<table class="table table-hover footable">
<thead>
<tr>
<th>Home Team</th>
<th> vs </th>
<th>Away Team</th>
<th data-hide="phone, tablet">Sport</th>
<th data-hide="phone, tablet">Competition</th>
<th data-hide="phone, tablet">Date and Time</th>
<th data-hide="phone, tablet">Channels</th>
</tr>
</thead>
<?php
if($stmt->rowCount() >0) {
while ($row = $stmt->fetch(PDO::FETCH_ASSOC))
{
$hometeam = $row['hometeam'];
$versus= $row['versus'];
$awayteam= $row['awayteam'];
$sport= $row['sport'];
$competition = $row['competition'];
$dateandtime=$row['dateandtime'];
$name=explode(',', $row['name']);
$channelid=explode(',', $row['channelid_fc']);
?>
<tbody>
<tr>
<td> <?php echo $row[hometeam] ; ?> </td>
<td> <?php echo $row[versus] ; ?> </td>
<td> <?php echo $row[awayteam] ; ?> </td>
<td> <?php echo $row[sport] ; ?> </td>
<td> <?php echo $row[competition] ; ?> </td>
<td> <?php echo $row[dateandtime] ; ?> </td>
<td>
<?php for ($i = 0; $i < count($channelid) && $i < count($name); ++$i) {
$achannelid = $channelid[$i];
$aname = $name[$i];
echo "<a href='http://sportschedule.xyz/view_channels.php?channelid=" .$achannelid."'> ".$aname." </br> </a> ";
}
?>
</tbody>
</td>
</tr>
<?php } ?>
<?php } else { ?>
<p>No matches found for the team you searched. Please try again</p>
<?php } ?>
</table>
</div>
</div>
</div>
</div>
<script>
$('.footable').footable({ addRowToggle: false });
$('.footable').footable({
calculateWidthOverride: function() {
return { width: $(window).width() };
}
});
$(document).ready(function(){ if ($.trim($(".footable tbody").text()).length == 0) { $('.footable').hide(); } });
</script>
</body>
</html>
Many Thanks to anyone who reads, and/or suggests how I could achieve a solution or steers me in the right direction for assistance
