Hello,
I need help creating/setting up an online checklist that the user can return to with out losing their checks in a checkbox.
Fang suggest Server-Side language would be the best option, since I'm a noob to this I need some help please.
Basically i have a series of pictures (of comic book issues) with a checkbox next to it that people can check saying they own that issue, but when refreshing the page the checkboxes reset, I would like them to stay checked unless the user unchecks it.
I agree a server-side solution is probably the best way. Another option you have is to use cookies to store the state of your checkboxes, but cookies have their disadvantages.
If using a server side solution I would do something like this.
Assuming your user has the option to navigate to a range of pages from the page with the checkboxes:
1) Start a session on the page displaying the checkboxes.
2) Every time a user clicks a checkbox, use AJAX to send a request to the server to update the status value of the session variable for that checkbox.
3) On subsequent visits to the page with the checkboxes, set the default/initial checked status of each checkbox to the appropriate state according to the currrent value of the session variable for that checkbox.
Don't use Ajax, do use cookies and do consult the forum associated with the scripting language that you plan to use. What do you have available? PHP?
“The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”
—Tim Berners-Lee, W3C Director and inventor of the World Wide Web
I do have PHP available, I'm sorry but I'm very new to the development part of websites... I'm one of those Graphic Design guys who wants it to work one way but doesn't know how to get there.
I use Adobe GoLive, and have a very limited knowledge of scripting. Here is a link to the site to get a better idea of what's needed. http://www.collectingpunisher.com
Although cookies is an option, as you are aware, I wouldn't use cookies because you most probably will have probelms with users who have cookies disabled or who clear them at some stage for any reason.
I would prefer to do something like this:
The page containing the checkboxes;
home.php
PHP Code:
<?php
session_start();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
<div>
<a href="test2.php">Go to to test2.php</a>
</div>
</body>
</html>
On page load, the checkbox statuses are set according to the values in the session array storing the status of each checkbox.
When you click a checkbox, an ajax request is sent to saveStatus.php to update the status of the clicked checkbox in the session array storing the status of each checkbox.
But only because the Session module is using cookies to save state. So your "example" relies upon two iffy technologies (JavaScript and cookies) and two server side scripts. My suggested method relies upon one iffy technology (cookies) and requires just one server side script.
“The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”
—Tim Berners-Lee, W3C Director and inventor of the World Wide Web
But only because the Session module is using cookies to save state. So your "example" relies upon two iffy technologies (JavaScript and cookies) and two server side scripts. My suggested method relies upon one iffy technology (cookies) and requires just one server side script.
Thank you for your opnion
I just posted how I would do it if I have a choice of methods and it works. I did not say it must be done this way. Given that, according to w3schools, in 2008 95% of users had javascript enabled (and imo that figure is much higher now) non-javascript browsers is no longer an issue for me...but that is just me
Tirna,
Thanks for the post, it looks like that will work for me, Is there anwyay for it to automatically read all the checkboxes, i have several pages with 40 boxes (over 300 total) on them and don't want to have to code for each one if at all possible.
You didn't mention if the id's for the 300+ checkboxes on the various pages are unique. I am assuming they are.
All you need to do then is substitute the window.onload I posted earlier with
PHP Code:
window.onload=function() {
//get all the checkboxes on this page and uncheck them
var chkBoxes = new Array();
var inpElems = document.getElementsByTagName("input");
for(var i=0; i < inpElems.length; i=i+1) {
if(inpElems[i].type == "checkbox") {
chkBoxes.push(inpElems[i]);
inpElems[i].checked = false; //uncheck all the boxes.
}
}
//transfer the session array storing the checkbox status to a javascript associative array
var storedStatus = new Array();
<?php
foreach($_SESSION['chkBoxes'] as $k => $v) {
echo 'storedStatus["'.$k.'"] = '.$v.';';
}
?>
//now set checked=true to the appropriate boxes
for(var i=0; i < chkBoxes.length; i=i+1) {
for(var k in storedStatus) {
if(chkBoxes[i].id == k && storedStatus[k] == 1) {
document.getElementById(k).checked = true;
break;
}
}
}
}
on each page where you have the checkboxes or use php's include() to inlude the code in each page.
I have tested the above code on my XAMPP for 1 page with text boxes and so it should work for multiple pages assuming all 300+ checkboxes have a unique id.
Reply With Quote
Originally Posted by tirna
Bookmarks