For Loop over an array.

robbymo

07-11-2007, 05: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, 06: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, 07: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>

</body>
</html>

[/CODE]

Bill Posters

07-11-2007, 10: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, 10: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">

</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>

</body>
</html>