Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.
Solved
Clearing table values once user navigates away from page
Posted on 2011-03-04
Hi Experts,
I have created a webpage that allows a user to enter table data and the table automatically refreshes using ajax.
However its only going to be used for proof of concept. So how can i clear any table entries a user has made once that user either leaves the website or refreshes the browser?
Many Thanks,
Dean
URL: http://www.the-lees.co.uk/site1/ajax_insert.php
I have created a webpage that allows a user to enter table data and the table automatically refreshes using ajax.
However its only going to be used for proof of concept. So how can i clear any table entries a user has made once that user either leaves the website or refreshes the browser?
Many Thanks,
Dean
URL: http://www.the-lees.co.uk/site1/ajax_insert.php
-
4
-
3
- +2
10 Comments
Since HTTP is stateless, you cannot "know" is a person is still on your page, or has his pc crashed or shutted duwn.
Normally sessions way of thinking is: "if the user comes back within x minutes, I keep his session active".
So what can you do is delete every entries not updated within the lapse you use for ajax updating. Keep in mind that the user can have temporary internet connection problems, and in this case you will think that the user gone away and delete his data...
An html trick can be using
<body onBeforeUnload="function()
that is triggered when the user close the page. You can perform an ajax call (syncronous is better) that erases all the data, plus a timed script that deletes all data older than x minutes.
Normally sessions way of thinking is: "if the user comes back within x minutes, I keep his session active".
So what can you do is delete every entries not updated within the lapse you use for ajax updating. Keep in mind that the user can have temporary internet connection problems, and in this case you will think that the user gone away and delete his data...
An html trick can be using
<body onBeforeUnload="function()
that is triggered when the user close the page. You can perform an ajax call (syncronous is better) that erases all the data, plus a timed script that deletes all data older than x minutes.
Store the data in serailized format in the session rather than the database and then when the user closes the session the data is wiped automatically.
http://www.php.net/serialize
http://www.php.net/unserialize
http://www.php.net/serialize
http://www.php.net/unserialize
bportlock can you still print the data from a session so as its displayed as if its coming from a database? Click link in my original post to see what im talking about.
Thanks,
Dean
Thanks,
Dean
Actually, thinking about it, is it possible to have a button that uses AJAX to empty the table without a page refresh?
If you want the ability to have a reset button on your form to clear the data then why don't you just use an HTML reset button:
<INPUT TYPE=RESET Value="Clear Form">
If that is all you want then you don't need AJAX to do it.
<INPUT TYPE=RESET Value="Clear Form">
If that is all you want then you don't need AJAX to do it.
smadeira: That would clear the form but not remove the things from the database that he's saved. Refreshing would bring it all back.
deanlee17:
Without seeing you php code I'm having to guess what your doing. I guess your ajax_data.php file saves the input to the database, then pulls it out again and echoes a <tr>...</tr> line with the data in it.
You could construct the table row directly from the form input without having to save it in the database at all. ajax_data.php seems to be broken at the moment. Show us the code if you want some help with it.
deanlee17:
Without seeing you php code I'm having to guess what your doing. I guess your ajax_data.php file saves the input to the database, then pulls it out again and echoes a <tr>...</tr> line with the data in it.
You could construct the table row directly from the form input without having to save it in the database at all. ajax_data.php seems to be broken at the moment. Show us the code if you want some help with it.
Hi Tonun,
I have attached the code that constructs the page, ive now set the page back to the way it was....
http://www.the-lees.co.uk/site1/ajax_insert.php
Thanks,
Dean
I have attached the code that constructs the page, ive now set the page back to the way it was....
http://www.the-lees.co.uk/site1/ajax_insert.php
Thanks,
Dean
<?
//connect to database
$dbhost = 'mysql01.myhostcp.com';
$dbuser = 'deans_user1';
$dbpass = 'qwerty123';
$dbname = 'deansghot5722com5233_deansdatabase';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
mysql_select_db($dbname);
//NOTE: MAKE SURE YOU DO YOUR OWN APPROPRIATE SERVERSIDE ERROR CHECKING HERE!!!
if(!empty($_POST) && isset($_POST))
{
$emptyvariables = false;
if(!empty($_POST)){
foreach($_POST as $key => $val){
if(empty($_POST[$key])){
echo"Please insert $key<br />";
$emptyvariables = true;
}
}
}
if($emptyvariables == false){
//make variables safe to insert
$id = mysql_real_escape_string($_POST['id']);
$Forename = mysql_real_escape_string($_POST['Forename']);
$Surname = mysql_real_escape_string($_POST['Surname']);
$Arrival_Date = mysql_real_escape_string($_POST['Arrival_Date']);
$Departure_Date = mysql_real_escape_string($_POST['Departure_Date']);
$RoomNo = mysql_real_escape_string($_POST['RoomNo']);
$Tel = mysql_real_escape_string($_POST['Tel']);
//query to insert data into table
$sql = "
INSERT INTO bookings
SET
id = '$id',
Forename = '$Forename',
Surname = '$Surname',
Arrival_Date = '$Arrival_Date',
Departure_Date = '$Departure_Date',
RoomNo = '$RoomNo',
Tel = '$Tel'";
echo"$query";
$result = mysql_query($sql);
if(!$result)
{
echo "Failed to insert record<br>Please Ensure booking does not currently exist";
}
else
{
echo "Record inserted successfully";
}
}
}
?>
<table width="300" border="1">
<tr>
<td><b>ID</b></td>
<td><b>Forename</b></td>
<td><b>Surname</b></td>
<td><b>Arrival_Date</b></td>
<td><b>Departure_Date</b></td>
<td><b>RoomNo</b></td>
<td><b>Tel</b></td>
</tr>
<?
//show data from tables
$sql = "
SELECT *
FROM bookings
ORDER BY ID ASC
LIMIT 20";
$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
{
//print data
?>
<tr>
<td><? echo $row['id']; ?></td>
<td><? echo $row['Forename']; ?></td>
<td><? echo $row['Surname']; ?></td>
<td><? echo $row['Arrival_Date']; ?></td>
<td><? echo $row['Departure_Date']; ?></td>
<td><? echo $row['RoomNo']; ?></td>
<td><? echo $row['Tel']; ?></td>
</tr>
<?
}
?>
</table>
Try it like this:
For this to work you'll need to make two changes. First your ajax_insert.php should load the initial rows from the database and put them in the table as ajax_data.php will now only output the new row. Secondly instead of replacing the whole table just add the new row by calling jquery.form like this:
<?
//connect to database
$dbhost = 'mysql01.myhostcp.com';
$dbuser = 'deans_user1';
$dbpass = 'qwerty123';
$dbname = 'deansghot5722com5233_deansdatabase';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
mysql_select_db($dbname);
//NOTE: MAKE SURE YOU DO YOUR OWN APPROPRIATE SERVERSIDE ERROR CHECKING HERE!!!
if(!empty($_POST) && isset($_POST))
{
$emptyvariables = false;
if(!empty($_POST)){
foreach($_POST as $key => $val){
if(empty($_POST[$key])){
echo"Please insert $key<br />";
$emptyvariables = true;
}
}
}
if($emptyvariables == false){
//make variables safe to insert
$id = mysql_real_escape_string($_POST['id']);
$Forename = mysql_real_escape_string($_POST['Forename']);
$Surname = mysql_real_escape_string($_POST['Surname']);
$Arrival_Date = mysql_real_escape_string($_POST['Arrival_Date']);
$Departure_Date = mysql_real_escape_string($_POST['Departure_Date']);
$RoomNo = mysql_real_escape_string($_POST['RoomNo']);
$Tel = mysql_real_escape_string($_POST['Tel']);
//query to insert data into table
$sql = "
INSERT INTO bookings
SET
id = '$id',
Forename = '$Forename',
Surname = '$Surname',
Arrival_Date = '$Arrival_Date',
Departure_Date = '$Departure_Date',
RoomNo = '$RoomNo',
Tel = '$Tel'";
echo"$query";
/*$result = mysql_query($sql);
if(!$result)
{
echo "Failed to insert record<br>Please Ensure booking does not currently exist";
}
else
{*/
echo "<td>$id</td><td>$Forename</td>$Surname<td>$Arrival_Date</td><td>$Departure_Date</td><td>$RoomNo</td><td>$Tel</td>";
//}
}
}
?>
For this to work you'll need to make two changes. First your ajax_insert.php should load the initial rows from the database and put them in the table as ajax_data.php will now only output the new row. Secondly instead of replacing the whole table just add the new row by calling jquery.form like this:
$(document).ready(function() {
$('#myForm').ajaxForm({
success: function(responseText) {
$('#showdata tr:last').after('<tr>' + responseText + '</tr>');
}
});
});
Featured Post
ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.
One of a set of tools we're offering as a way to say thank you for being a part of the community.
Question has a verified solution.
Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.
Have a better answer? Share it in a comment.
Join & Write a Comment Already a member? Login.
Many old projects have bad code, but the budget doesn't exist to rewrite the codebase. You can update this code to be safer by introducing contemporary input validation, sanitation, and safer database queries.
This holiday season, we’re giving away the gift of knowledge—tech knowledge, that is. Keep reading to see what hacks, tips, and trends we have wrapped and waiting for you under the tree.
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
Suggested Courses
Course of the Month10 days, 12 hours left to enroll
608 members asked questions and received personalized solutions in the past 7 days.
Join the community of 500,000 technology professionals and ask your questions.