How to use an IF/ELSE statement in HTML

Greetings,

I have HTML code and I need to incorporate an IF statement.  The code goes something like this:

....
....
/*  Determine what option the user wants */
<select>
  <option>Option_1
  <option>Option_2
 </select>

....
....
/* Depending on what option, display the appropriate links */

IF (Option_1)
<select>
  <option>html_link_1  
  <option>html_link_2
  <option>html_link_3
</select>

ELSE
<select>
  <option>html_link_4  
  <option>html_link_5
  <option>html_link_6
</select>

This is the basic idea but I know the IF/ELSE is not correct.  What is the syntax and do I need javascript for this?  If so please illustrate.

Also, if the user doesn't work from the top down like he/she should, I need to alert the user that they haven't made an Option selection.

There is no code-behind.  This is straight HTML

Thank you !!

If I use java script I realize it would be similar to this code but I don't know what triggers this code to be executed from the HTML code above:

<script type="text/javascript">
var Opt = OptionVariable
if (Opt = 1)
  {
  /*  don't know what to do here */
  }
else if (Opt = 2)
  {
  /*  don't know what to do here */
  }
else
  {
  document.write("<b>You haven't made an Option selection!</b>");
  }
</script>

Open in new window

John500Asked:
Who is Participating?
 
Jagadishwor DulalBraces MediaCommented:
The Complete Tested working code here:

<head>
<title>Chain Select</title>
<script>
var options=new Array();
options[0]=new Array();
options[0]['myoptions']='Option_1';
options[0]['sub_options']=['html_link_1','html_link_2','html_link_3','html_link_4'];
options[1]=new Array();
options[1]['myoptions']='Option_2';
options[1]['sub_options']=['html_link_5','html_link_6','html_link_7','html_link_8'];
function initBoxes(box1,box2) {
var myoptions=document.getElementById(box1);
var subOptions=document.getElementById(box2);
for (i=0; i<options.length; i++) {
  var x=document.createElement('option');
  var y=document.createTextNode(options[i]['myoptions']);
  if (window.attachEvent) { // for IE
  x.setAttribute('value',y.nodeValue);
  }
  x.appendChild(y);
  myoptions.appendChild(x);
}

myoptions.onchange=function() {
  if(this.value!="") {
   var list=document.getElementById(box2);
   while (list.childNodes[0]) {
    list.removeChild(list.childNodes[0])
   }
   fillBox2(subOptions,this.value);
   }
  }

fillBox2(subOptions,myoptions.value);
}
function fillBox2(box2,myoptions) {
for (i=0; i<options.length; i++) {
  if (options[i]['myoptions']==myoptions) {
   var sub_options=options[i]['sub_options'];
  }
}
for (i=0; i<sub_options.length; i++) {
  var x=document.createElement('option');
  var y=document.createTextNode(sub_options[i]);
  x.appendChild(y);
  box2.appendChild(x);
  }
} 
window.onload=function() {initBoxes('myoptions','subOptions');} 
</script>
</head>

<body>

<form method="post" action="#">
<p>
  <label>Select Options: 
  <select id="myoptions" name="myoptions">
</select></label>
<label>Select Sub Options: 
<select id="subOptions" name="subOptions">
</select></label></p>
</form>
</body>
</html>

Open in new window

0
 
honestman31Commented:
You have to use PHP , DO u have PHP installed if so I can provide example
0
 
honestman31Commented:
Sorry I'm wrong , This needs javascript not PHP , sorry for that
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
Jagadishwor DulalBraces MediaCommented:
Use javascript chain select so that you can do it:
For your reference please see the pages:

http://bonrouge.com/~chain_select_js
http://www.dhtmlgoodies.com/index.html?whichScript=ajax_chained_select
0
 
John500Author Commented:
Thanks to both of you.

jagadishdulal - I tried the code you suggested - see the picture below.  

As you can see, it almost does what I want but it complicates matters with all the extra stuff.  Is there any way you can modify the code to do what I want.  The selections in my routine are just a few in either case

IF (Option_1)
<select>
  <option>html_link_1  
  <option>html_link_2
  <option>html_link_3
</select>

ELSE
<select>
  <option>html_link_4  
  <option>html_link_5
  <option>html_link_6
</select>

The example is not making it easier.  Thanks again for the help!




html-example.JPG
0
 
John500Author Commented:
Terrific !

That's the ticket.

Thanks!
0
 
John500Author Commented:
Please see the following question which deals with this code:

http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/HTML/Q_26979239.html

Thanks !
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.