Number to Image JS

JavaScript
21

When you click the link you are getting that message? I am not sure, what do you recommend?

Does anything stand out? This is my latest code:

window.onload = initAll;
var usedNums = new Array(76);

function initAll() {
if (document.getElementById) {
document.getElementById(“reload”). onclick = anotherCard;
newCard();
}

}

function newCard() {
for (var i=0; i<24; i++) {
setSquare(i);
}
}

function setSquare(thisSquare) {
var currSquare = document.getElementById(“square” + thisSquare);
var colPlace = new Array(0,1,2,3,4,0,1,2,3,4,0,1,3,4,0,1,2,3,4,0,1,2,3,4);
var colBasis = colPlace[thisSquare] * 15;
var newNum;
var image;

do {
    newNum = colBasis + getNewNum() + 1;
} while (usedNums[newNum]);
usedNums[newNum] = true;

image = new Image();
image.src = 'http://consultantwithvision.com/radar/br1.jpg';

empty(currSquare);
currSquare.appendChild(image);

}

function getNewNum() {
return Math.floor(Math.random() * 15);
}
function anotherCard() {
for (var i=1; i<usedNums.length; i++) {
usedNums[1] = false;
}

}

22

I used: image.src = ‘http://consultantwithvision.com/radar/br1.jpg’; just as a filler for the time being…

23

That’s what is shown to me in the scripting console. In many web browsers you can get to it with Ctrl+Shift+J, while in IE8/IE9 you can use F12, or turn on the advanced browser option called “Display a notification about every script error”

Here’s some info on debugging in Internet Explorer, [url=“http://betterexplained.com/articles/how-to-debug-web-applications-with-firefox/”]debugging in Firefox and [url=“http://www.google.com/chrome/intl/en/webmasters-faq.html#jsexec”]debugging in Google Chrome

24

Yes - from the error message, the function called empty is missing.
I suggest that you put it in there.

25

OK - JS updated to:
window.onload = initAll;
var usedNums = new Array(76);

function initAll() {
if (document.getElementById) {
document.getElementById(“reload”). onclick = anotherCard;
newCard();
}

}

function newCard() {
for (var i=0; i<24; i++) {
setSquare(i);
}
}

function setSquare(thisSquare) {
var currSquare = document.getElementById(“square” + thisSquare);
var colPlace = new Array(0,1,2,3,4,0,1,2,3,4,0,1,3,4,0,1,2,3,4,0,1,2,3,4);
var colBasis = colPlace[thisSquare] * 15;
var newNum;
var image;

do {
    newNum = colBasis + getNewNum() + 1;
} while (usedNums[newNum]);
usedNums[newNum] = true;

image = new Image();
image.src = 'http://consultantwithvision.com/radar/br1.jpg';

}
function empty(el) {
if (el.hasChildNodes()) {
el.removeChild(el.firstChild);
}
}

function getNewNum() {
return Math.floor(Math.random() * 15);
}
function anotherCard() {
for (var i=1; i<usedNums.length; i++) {
usedNums[1] = false;
}
}

Still not working… Here is the link: Make Your Own Bingo Card

26

OK I found the debug - Its still showing Empty is not defined. How would I define the empty? Do I have something in the wrong spot?

27

My God - its working! you are the best!

28

There is a process when programming called debugging, where you learn about the issues that are occurring and take small steps to get closer to a solution.
Debugging is typically not a one-step-fix-all process.

You may be having a caching issue, where the local web browser caches the previous version of the script. You can use Ctrl+F5 to force a non-cached reload of the web page.

29

Good job.