Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

How to use an IF/ELSE statement in HTML

Posted on 2011-04-25
7
Medium Priority
?
212 Views
Last Modified: 2012-05-11
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

0
Comment
Question by:John500
  • 3
  • 2
  • 2
7 Comments
 
LVL 10

Expert Comment

by:honestman31
ID: 35464073
You have to use PHP , DO u have PHP installed if so I can provide example
0
 
LVL 10

Expert Comment

by:honestman31
ID: 35464084
Sorry I'm wrong , This needs javascript not PHP , sorry for that
0
 
LVL 15

Expert Comment

by:Jagadishwor Dulal
ID: 35464107
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
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 

Author Comment

by:John500
ID: 35464153
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
 
LVL 15

Accepted Solution

by:
Jagadishwor Dulal earned 2000 total points
ID: 35464294
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
 

Author Comment

by:John500
ID: 35464313
Terrific !

That's the ticket.

Thanks!
0
 

Author Comment

by:John500
ID: 35471416
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

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
Over time, the online landscape has altered considerably, but that’s nothing compared to the up-and-coming trends that will shape the web design industry in the coming year. Keep reading to find out which trends will shape B2B web design in 2018.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
This video shows how to quickly and easily deploy an email signature for all users in Office 365 and prevent it from being added to replies and forwards. (the resulting signature is applied on the server level in Exchange Online) The email signat…
Suggested Courses

571 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question