I have created a html/css website with different pages, it is a menu and I would like to add checkboxes which add up the total of what they wish to order. As all other aspects of the menu are separate I would like this to be separate so I have created another page and assigned values to each check box and the total works when its on the same page nut not when on different, is there any way to overcome this?
This is the code:
<script type="text/javascript">
function checkTotal() {
document.listForm.total.value = '';
var sum = 0;
for (i=0;i<document.listForm.choice.length;i++) {
if (document.listForm.choice[i].checked) {
sum = sum + parseInt(document.listForm.choice[i].value);
}
}
document.listForm.total.value = sum;
}
</script>
<input type="checkbox" name="choice" value="8.99" onchange="checkTotal()"/>£8.99<br/>
on another page
<p>The Total Of The Order is: <input type="text" size="2" name="total" value="0"/>
Please help and if it isn't obvious I am a beginner
I would use a cookie. The following code from How do I set/unset cookie with jQuery?.
function createCookie(name, value, days) {
var expires;
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
} else {
expires = "";
}
document.cookie = escape(name) + "=" + escape(value) + expires + "; path=/";
}
function readCookie(name) {
var nameEQ = escape(name) + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) === ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) === 0) return unescape(c.substring(nameEQ.length, c.length));
}
return null;
}
function eraseCookie(name) {
createCookie(name, "", -1);
}
Then in your code something like the following
function checkTotal() {
erase("checkBoxes");
var sum = 0;
for (i=0;i<parseInt(readCookie("checkBoxes"));i++) {
if (document.listForm.choice[i].checked) {
sum = sum + parseInt(document.listForm.choice[i].value);
}
}
createCookie("checkBoxes",sum,5);
}
Related
This JavaScript code is supposed to increase the number
<script type="text/javascript">
var number = 100035;
function increment()
{
number = Math.floor(Math.random() * 500) + number;
showNumber(number);
}
function showNumber(num)
{
document.getElementById("displayDiv").innerHTML = "€" + num;
}
window.onload = function()
{
setInterval("increment()", 1000);
showNumber(number);
}
</script>
<div id="displayDiv"></div>
I must be able to display the last generated number when users refresh the page and when users return to the website. However, the number does not continue from the last generated number and instead starts over.
How can I get this to work?
I try to avoid using intervals so I use setTimeout here, instead.
<script type="text/javascript">
var number = checkCookie();
var daysBeforeExpiration = 365;
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1);
if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
}
return "";
}
function checkCookie() {
var number = getCookie("number");
if (number == "") {
number = "100035"
setCookie("number", number, daysBeforeExpiration);
}
return parseInt(number);
}
function showNumber(num)
{
document.getElementById("displayDiv").innerHTML = "€" + num;
}
incrementInterval = function() {
showNumber(number);
number = Math.floor(Math.random() * 100) + number;
setCookie("number", number.toString(), daysBeforeExpiration)
setTimeout(incrementInterval, 1000);
};
window.onload = function () {
incrementInterval();
};
</script>
I have two pages not popup. I want pass value from one to textbox in another one. And then close sender page.
If i use popup, I use this codes
My textbox in first page codes.
<input type="text" name="ModelTulID" id="ModelTulID"/>
Sender page's codes:
<input name="ModelID" type="hidden" value="<%=ID%>" />
<input type="button" value="Submit" onClick="sec()">
<script type="text/javascript">
function Sec() {
if (window.opener != null && !window.opener.closed) {
var txtName = window.opener.document.getElementById("ModelTulID");
txtName.value = document.getElementById("ModelID").value;
}
window.close();
}
But my pages are not popup and i don't know what i do. I tried window.top instead window.opener but it didn't work.
Thanks for your helps...
What you may want to take a look at is Javascript cross page cookies.
http://www.quirksmode.org/js/cookies.html
Set Get Cookie Demo
function createCookie(name, value, days) {
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
var expires = "; expires=" + date.toGMTString();
} else var expires = "";
document.cookie = name + "=" + value + expires + "; path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
}
return null;
}
function eraseCookie(name) {
createCookie(name, "", -1);
}
I am trying to append some data on run time..
now I have to store this appended data into client side Cookies.
Any suggestion much appreciated. Thanks in advance.
here is the code and fiddle URL:
$('#add').on('click', function(){
var inputHTML = $('#inputName').val();
$('<li>'+inputHTML+'</li>').appendTo('#inputBox > ul');
});
http://jsfiddle.net/ft26u/12/
You can use localStorage, like this:
$('#add').on('click', function(){
var inputHTML = $('#inputName').val();
$('<li>'+inputHTML+'</li>').appendTo('#inputBox > ul');
var myData = localStorage.cookieData ? JSON.parse(localStorage.cookieData) : new Array();
myData.push(inputHTML);
localStorage.cookieData = JSON.stringify(myData);
console.log(myData);
})
Use these functions:
function createCookie(name, value, days) {
var expires;
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
} else {
expires = "";
}
document.cookie = escape(name) + "=" + escape(value) + expires + "; path=/";
}
function readCookie(name) {
var nameEQ = escape(name) + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) === ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) === 0) return unescape(c.substring(nameEQ.length, c.length));
}
return null;
}
function eraseCookie(name) {
createCookie(name, "", -1);
}
Edit Updated sample to load cookie on load
http://jsfiddle.net/aZXMr/3/
I use jfontsize' to increase/decrease the size of my font on my website.
Does anyone know of a way to remember the settings between the pages and when a user returns to the site?
I've been trying to create a cookie but I'm not having much luck!
Here is what I currently have:
<script type="text/javascript" language="javascript">
function createCookie("textsizestyle", textsize, 365) {
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
var expires = "; expires=" + date.toGMTString();
}
else var expires = "";
document.cookie = name + "=" + value + expires;
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ')
c = c.substring(1, c.length);
if (c.indexOf(nameEQ) == 0)
return c.substring(nameEQ.length, c.length);
}
return null;
}
</script>
would anyone mind giving me some pointers?
Thanks!
I having problem figuring howto preserve the present state ...Let say I have selected radio button and checkbox in present form and navigate way to a different page but if I want to go back to old page how should I able to see the selected radio and checkboxes in my previous page..
Well you can use cookies to do the same. here is a small code snippet that acts over cookies:
var myCookieHandler = (function () {
return {
createCookie: function (name, value, days) {
var expires = "";
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
}
document.cookie = name + "=" + value + expires + "; path=/";
},
readCookie: function (name) {
var nameEq = name + "=";
var ca = document.cookie.split(';');
var i;
for (i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) === ' ') { c = c.substring(1, c.length); }
if (c.indexOf(nameEq) === 0) { return c.substring(nameEq.length, c.length); }
}
return null;
},
deleteCookie: function (name) {
this.createCookie(name, null, -1);
}
};
}());
usage:
myCookieHandler .writeCookie("Login","true",2);
var cookieValue=myCookieHandler.readCookie("Login");
myCookieHandler.deleteCookie("Login");
Thus when you come back to this page you read your cookie and do the necessary with the same.
Hope this helps..