...

View Full Version : working w commented html code



robbymo
06-01-2007, 11:39 AM
I have been trying to edit the code so that its functional with sets 2 and 3 commented out and I can't get it to function. Is there something specific that Im doing wrong

<script language="JavaScript" type="text/javascript">
<!--


function ShowHide(sel){
var probnum = document.getElementById('problem').value;
var disp='';
if((sel.value==null) || (sel.value.length==0)){
document.getElementById('ques').innerHTML ='none';
}
else {
if(probnum=='s1'){
for(var i=1; i<=4 ; i++){
disp = disp + (document.getElementById('q'+i).innerHTML);
}
}
else
if(probnum=='2'){
disp = (document.getElementById('s1').innerHTML);
disp = disp + (document.getElementById('q2').innerHTML);
disp = disp + (document.getElementById('q5').innerHTML);
disp = disp + (document.getElementById('q6').innerHTML);
}
else{
disp = (document.getElementById('s2').innerHTML);
disp = disp + (document.getElementById('q6').innerHTML);
disp = disp + (document.getElementById('q7').innerHTML);
}
//for (var i=1; i<6 ; i++){
//disp = disp + (document.getElementById('s'+probnum+'q'+i).innerHTML);
//}
document.getElementById('ques').innerHTML =disp;
}
}function showhide(this){
if (document.getElementById){
obj = document.getElementById(id);
if (obj.style.display == "none"){
obj.style.display = "";
} else {
obj.style.display = "none";
}
}
}




//-->


</script>
</head>



<body>
choose problem that is happening from the list.<br>

<select id="problem" size="1" onChange="ShowHide(this)">
<option value=""></option>
<option value="1">
Problem 1
</option>
<option value="2">
Problem 2
</option>
<option value="3">
Problem 3
</option>
</select>

<div id='ques'>
</div>
<div id="s1q1" class="Question">
Question1:<BR> <textarea cols="40" rows="5" name="myname1">
</textarea><BR>
</div>
<div id="s1q2" class="Question">
Question2:<BR> <textarea cols="40" rows="5" name="myname2">
</textarea><BR>
</div>
<div id="s1q3" class="Question">
Question3:<BR> <textarea cols="40" rows="5" name="myname3">
</textarea><BR>
</div>
<div id="s1q4" class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname4">
</textarea><BR>
</div>
<div id="s1q5" class="Question">
Question5:<BR> <textarea cols="40" rows="5" name="myname5">
</textarea><BR>
</div>
<div id="s1q6" class="Question">
Question6:<BR> <textarea cols="40" rows="5" name="myname6">
</textarea><BR>
</div>
<div id="s1q7" class="Question">
Question7:<BR> <textarea cols="40" rows="5" name="myname7">
</textarea><BR>
</div>



<!--
<div id="s2q1 class="Question">
Question1Set2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q2 class="Question">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q3 class="Question">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q4 class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q5 class="Question">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>

<div id="s3q1 class="Question">
Question1set3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q2 class="Question">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q3 class="Question">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q4 class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q5 class="Question">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
-->

koyama
06-02-2007, 03:51 AM
I have been trying to edit the code so that its functional with sets 2 and 3 commented out and I can't get it to function. Is there something specific that Im doing wrong
The parts that have been commented are not being displayed, so the comments are working fine. But I guess that is not what you mean.

Could you elaborate a bit on what it is you are attempting?

robbymo
06-03-2007, 08:06 PM
Im trying to be able to have this as a functional form that I don't have to edit when I delete the comments so sets 2 and 3 of questions are being displayed.

koyama
06-03-2007, 09:32 PM
Im trying to be able to have this as a functional form that I don't have to edit when I delete the comments so sets 2 and 3 of questions are being displayed.
This could be more like a JavaScript question. So you want a drop-down list to toggle which part of the form is visible?

See if the below code is what you are looking for. If not, try to explain more clearly what you want.

Note that this code needs improvent.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<script type="text/javascript">
function showhide(elSelect){
elSelect = document.getElementById('problem');
var i = 1;
while(el = document.getElementById('problem' + i)) {
if(elSelect.value == i) {
el.style.display = 'block';
}
else {
el.style.display = 'none';
}
i++;
}
}
window.onload = function() {
elSelect = document.getElementById('problem');
showhide();
elSelect.onchange = showhide;
}
</script>
</head>
<body>
<div>
choose problem that is happening from the list.<br>
<select id="problem" size="1">
<option value="" selected="selected">select problem</option>
<option value="1">Problem 1</option>
<option value="2">Problem 2</option>
<option value="3">Problem 3</option>
</select>

<div id="problem1" style="display: none">
<div id="s1q1" class="Question">
Question1:<BR> <textarea cols="40" rows="5" name="myname1">
</textarea><BR>
</div>
<div id="s1q2" class="Question">
Question2:<BR> <textarea cols="40" rows="5" name="myname2">
</textarea><BR>
</div>
<div id="s1q3" class="Question">
Question3:<BR> <textarea cols="40" rows="5" name="myname3">
</textarea><BR>
</div>
<div id="s1q4" class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname4">
</textarea><BR>
</div>
<div id="s1q5" class="Question">
Question5:<BR> <textarea cols="40" rows="5" name="myname5">
</textarea><BR>
</div>
<div id="s1q6" class="Question">
Question6:<BR> <textarea cols="40" rows="5" name="myname6">
</textarea><BR>
</div>
<div id="s1q7" class="Question">
Question7:<BR> <textarea cols="40" rows="5" name="myname7">
</textarea><BR>
</div>
</div>

<div id="problem2" style="display: none">
<div id="s2q1" class="Question">
Question1Set2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q2" class="Question">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q3" class="Question">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q4" class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q5" class="Question">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
</div>

<div id="problem3" style="display: none">
<div id="s3q1" class="Question">
Question1set3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q2" class="Question">
Question2:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q3" class="Question">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q4" class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q5" class="Question">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
</div>

</div>
</body>
</html>

robbymo
06-03-2007, 10:00 PM
Yes it is somewhat close to it. But I need to leave sets 2 and 3 commented but still have it functional for when I uncomment them.

Is there a way to get this to where when you chose each set of questions you would be able to show certain questions.

If choose Problem1, show
Question1
Question2
Question3
Question4

If choose Problem2, show
Question1
Question2
Question5
Question6

If choose Problem3, show
Question2
Question7
Question6

koyama
06-03-2007, 10:16 PM
Yes it is somewhat close to it. But I need to leave sets 2 and 3 commented but still have it functional for when I uncomment them.
Perhaps it is easier to comment the options:


<select id="problem" size="1">
<option value="" selected="selected">select problem</option>
<option value="1">Problem 1</option>
<!--<option value="2">Problem 2</option>-->
<!--<option value="3">Problem 3</option>-->
</select>
Since I'm not sure why you want to comment problem 2 and 3 I cannot tell you what is the best solution. Keep in mind that everything within the comments can always be seen when one says View > Page Source in the browser.

Is there a way to get this to where when you chose each set of questions you would be able to show certain questions.
The easiest thing would be to duplicate the questions. That means, put in question 1 in both block 1 and 2, question 2 in block 1, 2, and 3 etc.

Is this for use in a quest or something?

robbymo
06-03-2007, 10:26 PM
There is only info for the 1st set of questions and leave the 2nd and 3 sets commented out until there is info for those sets of questions

koyama
06-03-2007, 10:32 PM
There is only info for the 1st set of questions and leave the 2nd and 3 sets commented out until there is info for those sets of questions
In that case just use this for now and leave 2nd and 3rd block of HTML uncommented but with style="display: none" like I showed you in the example.


<select id="problem" size="1">
<option value="1" selected="selected">Problem 1</option>
<!--<option value="2">Problem 2</option>-->
<!--<option value="3">Problem 3</option>-->
</select>

robbymo
06-07-2007, 07:29 PM
I actually can not comment out problem 2 and 3 because I need that to be able to show and hide the questions.

If someone choses problem 1

Show questions 1 2 4


Choses problem 2

Show questions 3 5 6


Choses problem 3

Show questions 4 7

robbymo
06-09-2007, 10:43 PM
I actually can not comment out problem 2 and 3 because I need that to be able to show and hide the questions.

If someone choses problem 1

Show questions 1 2 4


Choses problem 2

Show questions 3 5 6


Choses problem 3

Show questions 4 7

koyama
06-09-2007, 10:59 PM
How about the code below? Basically, it is the same example as the one I posted before.

I just changed the questions a bit to make the question numbers for each problem match the question numbers in your last post. However, I'm still trying to figure out what it is you want?


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<script type="text/javascript">
function showhide(elSelect){
elSelect = document.getElementById('problem');
var i = 1;
while(el = document.getElementById('problem' + i)) {
if(elSelect.value == i) {
el.style.display = 'block';
}
else {
el.style.display = 'none';
}
i++;
}
}
window.onload = function() {
elSelect = document.getElementById('problem');
showhide();
elSelect.onchange = showhide;
}
</script>
</head>
<body>
<div>
choose problem that is happening from the list.<br>
<select id="problem" size="1">
<option value="" selected="selected">select problem</option>
<option value="1">Problem 1</option>
<option value="2">Problem 2</option>
<option value="3">Problem 3</option>
</select>

<div id="problem1" style="display: none">
<div id="s1q1" class="Question">
Question1:<BR> <textarea cols="40" rows="5" name="myname1">
</textarea><BR>
</div>
<div id="s1q2" class="Question">
Question2:<BR> <textarea cols="40" rows="5" name="myname2">
</textarea><BR>
</div>
<div id="s1q4" class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname4">
</textarea><BR>
</div>
</div>

<div id="problem2" style="display: none">


<div id="s2q3" class="Question">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q5" class="Question">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q6" class="Question">
Question6:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
</div>

<div id="problem3" style="display: none">
<div id="s3q4" class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q7" class="Question">
Question7:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
</div>

</div>
</body>
</html>

robbymo
06-09-2007, 11:04 PM
That code is fine. I need to just when
If choose Problem1, show
Question1
Question2
Question3
Question4

If choose Problem2, show
Question1
Question2
Question5
Question6

If choose Problem3, show
Question2
Question7
Question6

And somehow make this work with the code that is commented out.

koyama
06-09-2007, 11:14 PM
So you want to be able to comment out some question for some problem in order to quickly put in or take out a question?

In that case how about this? Here I have commented out question 1 in problem 1.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<script type="text/javascript">
function showhide(elSelect){
elSelect = document.getElementById('problem');
var i = 1;
while(el = document.getElementById('problem' + i)) {
if(elSelect.value == i) {
el.style.display = 'block';
}
else {
el.style.display = 'none';
}
i++;
}
}
window.onload = function() {
elSelect = document.getElementById('problem');
showhide();
elSelect.onchange = showhide;
}
</script>
</head>
<body>
<div>
choose problem that is happening from the list.<br>
<select id="problem" size="1">
<option value="" selected="selected">select problem</option>
<option value="1">Problem 1</option>
<option value="2">Problem 2</option>
<option value="3">Problem 3</option>
</select>

<div id="problem1" style="display: none">
<!--<div id="s1q1" class="Question">
Question1:<BR> <textarea cols="40" rows="5" name="myname1">
</textarea><BR>
</div>-->
<div id="s1q2" class="Question">
Question2:<BR> <textarea cols="40" rows="5" name="myname2">
</textarea><BR>
</div>
<div id="s1q4" class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname4">
</textarea><BR>
</div>
</div>

<div id="problem2" style="display: none">
<div id="s2q3" class="Question">
Question3:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q5" class="Question">
Question5:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s2q6" class="Question">
Question6:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
</div>

<div id="problem3" style="display: none">
<div id="s3q4" class="Question">
Question4:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
<div id="s3q7" class="Question">
Question7:<BR> <textarea cols="40" rows="5" name="myname">
</textarea><BR>
</div>
</div>

</div>
</body>
</html>

robbymo
06-09-2007, 11:15 PM
hey man feel free to im me on AIM wiseguy0424...Maybe if I explain it to you over IM.

felgall
06-10-2007, 12:26 AM
if you have the code commented then you may as well delete it as it is effectively not there.

If you are just trying to hide it then use Javascript to change the style of the sections between display:block and display:none

robbymo
06-10-2007, 01:17 AM
i've sent you what im trying to accomplish in a private message koyama.

thanks

robbymo
06-10-2007, 02:28 AM
Each question should be able to be shown/hidden individually. The group of questions to display for each Problem should be designated in an array, which is used with a show/hide function to show or hide each question as desired, depending on what group is active (i.e., what Problem is chosen).

_Aerospace_Eng_
06-10-2007, 02:42 AM
Is this an assignment?

robbymo
06-10-2007, 02:53 AM
No its not.. I just couldn't word it correctly so I had my friend write it out

koyama
06-12-2007, 12:00 AM
Each question should be able to be shown/hidden individually. The group of questions to display for each Problem should be designated in an array, which is used with a show/hide function to show or hide each question as desired, depending on what group is active (i.e., what Problem is chosen).
This sound more like a JavaScript question.

Anyway, take a look at the code below. It may give you some inspiration.

I know that it uses the non-standard document.write which may be criticized. Since I am not a JavaScript expert there may be other problems too.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<title>CF115360</title>
<script type="text/javascript">
problems = [];
problems[0] = {
num: 1,
questions: [0, 1, 3]
};
problems[1] = {
num: 2,
questions: [2, 4, 5]
};
problems[2] = {
num: 3,
questions: [3, 6]
};
q = [];
q[0] = 'What woman was arrested for voting in the 1872 election for U.S. president?';
q[1] = 'What city\'s drivers owe over $460 million in parking fines?';
q[2] = 'How many of every four Americans say that they believe in astrology?';
q[3] = 'What became America’s first organized sport, in 1664?';
q[4] = 'What weekday do more colds begin on than any other?';
q[5] = 'What’s the fastest swimming marine mammal?';
q[6] = 'What U.S. city was once know as Federal City?';

function showhide(elSelect){
elSelect = document.getElementById('problem');
var i = 0;
while(el = document.getElementById('problem' + i)) {
if(elSelect.value == i) {
el.style.display = 'block';
}
else {
el.style.display = 'none';
}
i++;
}
}

window.onload = function() {
elSelect = document.getElementById('problem');
showhide();
elSelect.onchange = showhide;
}
</script>
</head>
<body>
<div>
<h1>Choose a problem:</h1>
<script type="text/javascript">
document.write('<select id="problem" size="1">\n');
document.write('<option value="dummy" selected="selected">select problem<\/option>');
for(var i in problems) {
problem_number = problems[i].num;
document.write('<option value="' + i + '">Problem ' + problem_number + '<\/option>');
}
document.write('<\/select>\n');

for(var i in problems) {
document.write('<div id="problem' + i + '" style="display: none">\n');
for(var j in problems[i].questions) {
question = q[problems[i].questions[j]];
document.write('<div id="s' + i + 'q' + j + '" class="Question">' + question + '<div><textarea><\/textarea><\/div><\/div>\n');
}
document.write('<\/div>\n');
}
</script>
</div>
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum