Remembering Multiple Selections

Event based programming, as long as you are on this page, will remember your global variables. You would have to reset them to zero.

Here's the checkbox table setup: (same as radiobox setup)

<TABLE BORDER BGCOLOR = CYAN WIDTH = 200>
<TR><TD><INPUT TYPE = CHECKBOX NAME = Check1 onClick = check1Clicked()>Check 1</TD></TR>
<TR><TD><INPUT TYPE = CHECKBOX NAME = Check2 onClick = check2Clicked()>Check 2</TD></TR>
<TR><TD><INPUT TYPE = CHECKBOX NAME = Check3 onClick = check3Clicked()>Check 3</TD></TR>
<TR><TD><INPUT TYPE = CHECKBOX NAME = Check4 onClick = check4Clicked()>Check 4</TD></TR>
<TR><TD><INPUT TYPE = CHECKBOX NAME = Check5 onClick = check5Clicked()>Check 5</TD></TR>
</TABLE>

Here's the script:

<SCRIPT LANGUAGE = JavaScript>

var myTotal = 0
var newString = ""
var writingString = ""

function check1Clicked() {
myTotal = 1 + myTotal
newString = newString + ", check 1,"
writingString = "Total: " + myTotal + newString + " checked"
document.form1.Textbox.value = writingString
}

function check2Clicked() {
myTotal = 1 + myTotal
newString = newString + ", check 2,"
writingString = "Total: " + myTotal + newString + " checked"
document.form1.Textbox.value = writingString
}

function check3Clicked() {
myTotal = 1 + myTotal
newString = newString + ", check 3,"
writingString = "Total: " + myTotal + newString + " checked"
document.form1.Textbox.value = writingString
}

function check4Clicked() {
myTotal = 1 + myTotal
newString = newString + ", check 4,"
writingString = "Total: " + myTotal + newString + " checked"
document.form1.Textbox.value = writingString
}

function check5Clicked() {
myTotal = 1 + myTotal
newString = newString + ", check 5,"
writingString = "Total: " + myTotal + newString + " checked"
document.form1.Textbox.value = writingString
}

</SCRIPT>

1. Two global variables are set to zero and null respectively
   1. That gives the computer a place to start - otherwise it might stick some wierd value in there on it's own.
   2. If you are creating a survey - everytime they get to this page, (or go back to this page), these values will start where you want them to.
   3. This is extremely good programming practice - control over your variables, many programs will remember a variable from one spot to another and you need to control what value that variable holds.
   
   
   Every function that follows can now use these variables and remember them inbetween calls.
   
   var myTotal = 0
   var newString = ""
   var writingString = ""



2. 1 is added to myTotal to get a running total of the number of checks that were chosen
   
   function check1Clicked() {
   myTotal = 1 + myTotal
   
   sometimes you may see: myTotal += 1 That means the same thing
   
   
3. Each function looks exactly as the one before it, except that the value for the newString changes...
   
   newString = newString + ", check 1,"
   
   
4. I stick all those variables and some readable english into my writingString variable
   
   writingString = "Total: " + myTotal + newString + " checked"
   
   
5. Now, we set the textbox's value to my writingString variable
   
   document.form1.Textbox.value = writingString
   
   

Sending a variable, local variables

For local variables, check out this NEW and IMPROVED function

var myTotal = 0
var newString = ""

function checkClicked(checkBoxNum) {
myTotal = 1 + myTotal
newString = newString + ", check" + checkBoxNum + ", "
var writingString = "Total: " + myTotal + newString + " checked"
document.form1.Textbox.value = writingString
}

1. this new function can be used for every checkbox - hense the new function name
   
   function checkClicked(checkBoxNum) {
   
   
2. took the "writingString" out of Global variables and made it a variable local to that function. The reason for this is that ONLY this function needs to know that variable's value right now and that variable doesn't have to be remembered inbetween function calls
   
   var writingString = "Total: " + myTotal + newString + " checked"
   
   
3. Made a new local variable checkBoxNum -- yup, it tells the function what checkbox was checked. -- I send in that argument when a checkbox is checked.
   
   function checkClicked(checkBoxNum) {
   
   
4. Here's what the NEW and IMPROVED checkbox table looks like...(note the numbers that correlate to the variables used in the function.)
   
   <TABLE BORDER BGCOLOR = CYAN WIDTH = 200>
   <TR><TD><INPUT TYPE = CHECKBOX NAME = Check1 onClick = checkClicked(1)>Check 1</TD></TR>
   <TR><TD><INPUT TYPE = CHECKBOX NAME = Check2 onClick = checkClicked(2)>Check 2</TD></TR>
   <TR><TD><INPUT TYPE = CHECKBOX NAME = Check3 onClick = checkClicked(3)>Check 3</TD></TR>
   <TR><TD><INPUT TYPE = CHECKBOX NAME = Check4 onClick = checkClicked(4)>Check 4</TD></TR>
   <TR><TD><INPUT TYPE = CHECKBOX NAME = Check5 onClick = checkClicked(5)>Check 5</TD></TR>
   </TABLE>