Member Avatar for raheel_88

Hi guys,

I've got the following, very basic, working DHTML;

<HTML>
<HEAD>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function setup(ans) {
  lit = ''
  if (ans == 'anim') {
    lit = '<br><br>How many legs?   '
    lit = lit + '<SELECT NAME="q2" ONCHANGE="alert(document.quest.q2.value)">'
    lit = lit + '<OPTION VALUE="">- Please select -</OPTION>'
    lit = lit + '<OPTION VALUE="Cat">4</OPTION>'
    lit = lit + '<OPTION VALUE="Sparrow">2</OPTION>'
    lit = lit + '<OPTION VALUE="Snake">0</OPTION>'
    lit = lit + '</SELECT>'
  }
  if (ans == 'min') {
    lit = '<br><br>What colour?   '
    lit = lit + '<SELECT NAME="q2" ONCHANGE="alert(document.quest.q2.value)">'
    lit = lit + '<OPTION VALUE="">- Please select -</OPTION>'
    lit = lit + '<OPTION VALUE="Emerald">Green</OPTION>'
    lit = lit + '<OPTION VALUE="Ruby">Red</OPTION>'
    lit = lit + '<OPTION VALUE="Sapphire">Blue</OPTION>'
    lit = lit + '</SELECT>'
  }
  if (ans == 'elem') {
    lit = '<br><br>What kind of element?   '
    lit = lit + '<SELECT NAME="q2" ONCHANGE="alert(document.quest.q2.value)">'
    lit = lit + '<OPTION VALUE="">- Please select -</OPTION>'
    lit = lit + '<OPTION VALUE="Helium">Noble gas</OPTION>'
    lit = lit + '<OPTION VALUE="Fluorine">Halogen</OPTION>'
    lit = lit + '<OPTION VALUE="Lithium">Alkali metal</OPTION>'
    lit = lit + '</SELECT>'
  }
  document.getElementById('rep').innerHTML=lit
}
</SCRIPT>
</HEAD>
<BODY>

<FORM ACTION="#" NAME="quest">
What is it?   <SELECT NAME="q1" ONCHANGE="setup(document.quest.q1.value)">
<OPTION VALUE="">- Please select -</OPTION>
<OPTION VALUE="anim">Animal</OPTION>
<OPTION VALUE="min">Mineral</OPTION>
<OPTION VALUE="elem">Element</OPTION>
</SELECT>

<SPAN ID="rep"></SPAN>

</FORM>

</BODY>
</HTML>

But I want the final answer to come up as text on the screen rather than as an alert pop-up. Any idea on how I'd do this? I'm very new to web development (been working on it for a day) so any help would be much appreciated. Thanks!

  • 2 Contributors
  • 2 Replies
  • 270 Views
  • 12 Hours Discussion Span
  • Latest Post Latest Post by raheel_88
Member Avatar for stbuchok

This is still bad code, but it works.

<HTML>
<HEAD>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function setup(selectedValue) {
	var lit = '';

	switch(selectedValue){
	  	case '0':

	  		lit = '<br><br>How many legs?   ';
		    lit = lit + '<SELECT NAME="q2" ONCHANGE="giveAnswer(this.value);">';
		    lit = lit + '<OPTION VALUE="">- Please select -</OPTION>';
		    lit = lit + '<OPTION VALUE="Cat">4</OPTION>';
		    lit = lit + '<OPTION VALUE="Sparrow">2</OPTION>';
		    lit = lit + '<OPTION VALUE="Snake">0</OPTION>';
	    	lit = lit + '</SELECT>'

	  		break;

	  	case '1':

			lit = '<br><br>What colour?   ';
    		lit = lit + '<SELECT NAME="q2" ONCHANGE="giveAnswer(this.value);">';
    		lit = lit + '<OPTION VALUE="">- Please select -</OPTION>';
    		lit = lit + '<OPTION VALUE="Emerald">Green</OPTION>';
    		lit = lit + '<OPTION VALUE="Ruby">Red</OPTION>';
    		lit = lit + '<OPTION VALUE="Sapphire">Blue</OPTION>';
    		lit = lit + '</SELECT>'

		  	break;

	  	case '2':

	  		lit = '<br><br>What kind of element?   ';
		    lit = lit + '<SELECT NAME="q2" ONCHANGE="giveAnswer(this.value);">';
		    lit = lit + '<OPTION VALUE="">- Please select -</OPTION>';
		    lit = lit + '<OPTION VALUE="Helium">Noble gas</OPTION>';
		    lit = lit + '<OPTION VALUE="Fluorine">Halogen</OPTION>';
		    lit = lit + '<OPTION VALUE="Lithium">Alkali metal</OPTION>';
    		lit = lit + '</SELECT>'

		  	break;
	}

	document.getElementById('rep').innerHTML = lit;
}

function giveAnswer(value){
	document.getElementById('answer').innerHTML = value;
}
</SCRIPT>
</HEAD>
<BODY>

<FORM ACTION="#" NAME="quest">
What is it?   <SELECT NAME="q1" ONCHANGE="setup(this.value)">
<OPTION VALUE="">- Please select -</OPTION>
<OPTION VALUE="0">Animal</OPTION>
<OPTION VALUE="1">Mineral</OPTION>
<OPTION VALUE="2">Element</OPTION>
</SELECT>

<SPAN ID="rep"></SPAN>

<hr />

<div id="answer"></div>

</FORM>

</BODY>
</HTML>
commented: Concise help, much appreciated! +1
Member Avatar for raheel_88

Excellent, thank you very much!

Problem solved, til the next time...

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.