...

View Full Version : For Loop over an array.



robbymo
07-11-2007, 06:27 PM
I have a set of questions I need to place in a for loop over an array. Can someone give me some insight?

Bill Posters
07-11-2007, 07:35 PM
e.g.

for (var i = 0, el; el = arrayName; i++) {

if ([I]condition1) {
// do something
}

if (condition2) {
// do something else
}

if (condition3) {
// do something else instead
}

}

Variable names i and el can be anything you like. I've used i to represent index and el to represent element

See also:
http://www.w3schools.com/js/js_loop_for.asp
http://www.w3schools.com/js/js_if_else.asp

robbymo
07-11-2007, 08:23 PM
I need to use this code around a set of questions.

function showhide(id){

if (document.getElementById){

obj = document.getElementById(id);

if (obj.style.display == "none"){

obj.style.display = "";

} else {

obj.style.display = "none";

}

}

}



</script>

choose problem that is happening from the list.<br>
<select name="problem" id="problem" size="1" onChange="showhide()">
<option value="1">Problem 1</option>
<option value="2">Problem 2</option>
<option value="3">Problem 3</option>
</select>

<div id="s1q1" class="divHide">
Question1:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q2" class="divHide">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q3" class="divHide">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q4" class="divHide">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q5" class="divHide">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q6" class="divHide">
Question6:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q7" class="divHide">
Question7:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<!--
<div id="s2q1" class="divHide">
Question1Set2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q2" class="divHide">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q3" class="divHide">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q4" class="divHide">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q5" class="divHide">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q6" class="divHide">
Question6:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q7" class="divHide">
Question7:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q1" class="divHide">
Question1set3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q2" class="divHide">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q3" class="divHide">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q4" class="divHide">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q5" class="divHide">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
<div id="s3q6" class="divHide">
Question6:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q7" class="divHide">
Question7:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
-->
</body>
</html>

[/CODE]

Bill Posters
07-11-2007, 11:21 PM
e.g.?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-GB">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>test</title>
<style type="text/css">

.hide {
display: none;
}

fieldset {
margin: 0 0 30px;
border: 0 none;
}

legend {
margin: 0 0 30px;
padding: 0;
font-weight: bold;
}

fieldset div {
margin: 0 0 30px;
}

</style>
<script type="text/javascript">

window.onload = function() {

showhide(1);

}

function showhide(val) {

var currentVal = document.forms['problems'].problem.options[document.forms['problems'].problem.selectedIndex].value;
var sets = document.getElementsByTagName('fieldset');

for (var i = 1, tSet; tSet = sets[i]; i++) {
if (tSet.id) {
tSet.className = 'hide';
}
}

sets[val].className = '';

}

</script>
</head>
<body>

<form id="problems" action="./">

<fieldset>

<legend>Questions</legend>

<label for="problem">Choose problem that is happening from the list.</label>
<select name="problem" id="problem" size="1" onchange="showhide(this.value)">
<option value="1">Problem 1</option>
<option value="2">Problem 2</option>
<option value="3">Problem 3</option>
</select>

</fieldset>

<fieldset id="set1">

<legend>Set 1</legend>

<div>
<label>Question 1.1:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 1.2:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 1.3:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 1.4:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 1.5:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 1.6:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 1.7:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

</fieldset>

<fieldset id="set2">

<legend>Set 2</legend>

<div>
<label>Question 2.1:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 2.2:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 2.3:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 2.4:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 2.5:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 2.6:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 2.7:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

</fieldset>

<fieldset id="set3">

<legend>Set 3</legend>

<div>
<label>Question 3.1:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 3.2:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 3.3:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 3.4:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 3.5:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 3.6:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

<div>
<label>Question 3.7:<br>
<textarea cols="40" rows="5" name="myname"></textarea>
</label>
</div>

</fieldset>


</form>

</body>
</html>

robbymo
07-11-2007, 11:42 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>
Dynamic Form
</title>
<style>
.divShow { visibility: visible; }
.divHide { display:none; }
</style>

<script language="JavaScript" type="text/javascript">
<!--
function showhide()
{
var probnum = document.getElementById('problem').value;

document.getElementById("s1q1").className = "divHide";
document.getElementById("s1q2").className = "divHide";
document.getElementById("s1q3").className = "divHide";
document.getElementById("s1q4").className = "divHide";
document.getElementById("s1q5").className = "divHide";
document.getElementById("s1q6").className = "divHide";
document.getElementById("s1q7").className = "divHide";
/*set2
document.getElementById("s2q1").className = "divHide";
document.getElementById("s2q2").className = "divHide";
document.getElementById("s2q3").className = "divHide";
document.getElementById("s2q4").className = "divHide";
document.getElementById("s2q5").className = "divHide";
document.getElementById("s2q6").className = "divHide";
document.getElementById("s2q7").className = "divShow";
*/
/*set3
document.getElementById("s3q1").className = "divHide";
document.getElementById("s3q2").className = "divHide";
document.getElementById("s3q3").className = "divHide";
document.getElementById("s3q4").className = "divHide";
document.getElementById("s3q5").className = "divHide";
document.getElementById("s3q6").className = "divHide";
document.getElementById("s3q7").className = "divShow";
*/

if (probnum == 1)
{
document.getElementById("s1q1").className = "divShow";
document.getElementById("s1q2").className = "divShow";
document.getElementById("s1q3").className = "divShow";
document.getElementById("s1q4").className = "divShow";

/* //set2
document.getElementById("s2q1").className = "divShow";
document.getElementById("s2q2").className = "divShow";
document.getElementById("s2q3").className = "divShow";
document.getElementById("s2q4").className = "divShow";
*/
/*//set3
document.getElementById("s3q1").className = "divShow";
document.getElementById("s3q2").className = "divShow";
document.getElementById("s3q3").className = "divShow";
document.getElementById("s3q4").className = "divShow";
*/

}
else if (probnum == 2)
{
document.getElementById("s1q1").className = "divShow";
document.getElementById("s1q2").className = "divShow";
document.getElementById("s1q5").className = "divShow";
document.getElementById("s1q6").className = "divShow";
/*//set2
document.getElementById("s2q1").className = "divShow";
document.getElementById("s2q2").className = "divShow";
document.getElementById("s2q5").className = "divShow";
document.getElementById("s2q6").className = "divShow";
*/

/*//set3
document.getElementById("s3q1").className = "divShow";
document.getElementById("s3q2").className = "divShow";
document.getElementById("s3q5").className = "divShow";
document.getElementById("s3q6").className = "divShow";
*/
}
else if (probnum == 3)
{
document.getElementById("s1q2").className = "divShow";
document.getElementById("s1q6").className = "divShow";
document.getElementById("s1q7").className = "divShow";
/*//set2
document.getElementById("s2q2").className = "divShow";
document.getElementById("s2q6").className = "divShow";
document.getElementById("s2q7").className = "divShow";
*/
/*//set3
document.getElementById("s3q2").className = "divShow";
document.getElementById("s3q6").className = "divShow";
document.getElementById("s4q7").className = "divShow";
*/
}
}
//-->
</script>
</head>

<body>
choose problem that is happening from the list.<br>
<select name="problem" id="problem" size="1" onChange="showhide()">
<option value="1">Problem 1</option>
<option value="2">Problem 2</option>
<option value="3">Problem 3</option>
</select>

<div id="s1q1" class="divHide">
Question1:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q2" class="divHide">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q3" class="divHide">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q4" class="divHide">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q5" class="divHide">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q6" class="divHide">
Question6:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s1q7" class="divHide">
Question7:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<!--
<div id="s2q1" class="divHide">
Question1Set2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q2" class="divHide">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q3" class="divHide">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q4" class="divHide">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q5" class="divHide">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q6" class="divHide">
Question6:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q7" class="divHide">
Question7:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q1" class="divHide">
Question1set3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q2" class="divHide">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q3" class="divHide">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q4" class="divHide">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q5" class="divHide">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
<div id="s3q6" class="divHide">
Question6:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q7" class="divHide">
Question7:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
-->
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum