How to share elements of an array between 2 pages

I have 2 html pages that have to return the same elements of an nested array.

How do I do this?

I have two html pages one named index.html and one named thank-you-deal-wheel.html.

I have a single external js file that these two pages share.

In my js file i have a nested array named sec, this array outputs the elements of the sec array to variables named result1 and result2, result1 and result2 are then shown via the .html() method. here is the relevant the codebase:

var sec = [
	    ["10% off", "15% off", "Free Shipping", "10% off", "25% off", "Free Shipping"],
	    ["<span class='redBold'>TEN</span>", "<span class='redBold'>FIFTEEN</span>", "<span class='redBold'>FREE SHIPPING</span>", "<span class='redBold'>TEN</span>", "<span class='redBold'>TWENTY-FIVE</span>", "<span class='redBold'>FREE SHIPPING</span>"]
];

var offset = 30;

//set default degree (360*5)
var degree = 1800;
//number of clicks = 0
var clicks = 0;

$(document).ready(function(){
	
	/*WHEEL SPIN FUNCTION*/
	$('#spinButton').click(function(){
      
		//add 1 every click
		clicks ++;
		
		/*multiply the degree by number of clicks
	  generate random number between 1 - 360, 
    then add to the new degree*/
		var newDegree = degree*clicks;
		var extraDegree = Math.floor(Math.random() * 360) + 1;
		totalDegree = newDegree+extraDegree;
		
    var colorIndex = Math.ceil(((totalDegree+30) % 360) / 60) -1;
    var colorPrev = colorIndex == 0 ? 5 : colorIndex - 1;
    var colorNext = colorIndex == 5 ? 0 : colorIndex + 1;
    
    offset = (extraDegree % 60);
    var result1 = sec[0][colorIndex];
    var result2 = sec[1][colorIndex];
    
    if(offset == 0) {
      result1,result2;
    } else if (offset <= 30) {
      result1,result2;
    } else {
      result1,result2;
    }
    
    $("#answer").html("Congratulations! Your deal is " + result1 + " on your next order. Use KEYCODE: " + result2 + " at checkout.");
	$("#percentageDiscount").html(result1);
    $("#keycodeDiscount").html(result2);

Everything works fine for the index.html page, it has an #answer where the .html() method places the variable result1 and result2 plus some text.

On the second html page though I get no results. none of the elements from the arrrays are placed in the #percentage discount or #keycodeDiscount id’s

How do I get the result1 and result2 variables to display their elements on the second html page?

Everything that I have read on is used to describe sharing form values between html pages, the elements inside my array have nothing to do with form values. I also read up on the sessionStorage html5 property, but am unclear how to use this or even if I can since it requres a key/name pair and I dont have that with my arrays.

I could really use some help. Thanks

Does the browser console show any errors that might help point towards what’s not going right?

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.