Solved

Code not working unless alert is put in or list selected twice??

Posted on 2004-04-08
13
235 Views
Last Modified: 2008-03-06
I have the following code. It won't work unless an alert is put in at the top of the "selSAN" function or the list is selected twice, what is wrong???

////////////////////////////////

<html>
<head>
<title>My SAN - View</title>
<script language="javascript">
function selSAN(){
      
      for(i=0; i < document.main.selectSAN.length ; i++)
      {
            if (document.main.selectSAN.options[i].selected ==  true)
            return true;      
      }
      return false;
}
function selFAB(){      
      for(i=0; i < document.main.selectFabric.length ; i++)
      {
            if (document.main.selectFabric.options[i].selected ==  true)
            return true;      
      }
      return false;
}
function selSWH(){
      
      for(i=0; i < document.main.selectSwitch.length ; i++)
      {
            if (document.main.selectSwitch.options[i].selected ==  true)
            return true;      
      }
      return false;
}

function manageSAN(){
    if (selSAN() == true) {
      document.main.selectFabric.disabled = false;
      document.getElementById("grey01").style.color = "#000000";
      } return true;
}

function manageFAB(){
      if ((selSAN() == true )&&(selFAB() == true )&&(selSWH() == false)) {            
            document.getElementById("level01").style.visibility = "hidden";
            document.getElementById("level02").style.visibility = "visible";
            document.getElementById("level03").style.visibility = "hidden";            
            document.main.selectSwitch.disabled = false;
        document.getElementById("grey02").style.color = "#000000";
      }
}

function manageSWH(){
      if ((selSAN() == true )&&(selFAB() == true )&&(selSWH() == true)){
            document.getElementById("level01").style.visibility = "hidden";
            document.getElementById("level02").style.visibility = "hidden";
            document.getElementById("level03").style.visibility = "visible";
      }
}
</script>              
</head>
</div>
<div id="level02" style="position: absolute; visibility: hidden; z-index: 2; left:166; top: 440;">
      <table cellpadding=0 cellspacing=2 border=0 width=594 bgcolor="teal">
      <tr>
            <td>
            <table cellpadding=0 cellspacing=0 border=0 width=594>
            <tr>
                  <td bgcolor="#FFFFFF" colspan="6" class="mysanTitles"><div class="subHead2">Step 2(2): Select data to display.</div></td>
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="198" colspan=2><font color="teal">Totals across selected Fabrics</font></td>
                  <td bgcolor="#FFFFFF" width="396" colspan=4><font color="teal">Data for each selected Fabrics</font></td>                  
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Switch port usage summary</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Alias entries</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Active configuration</td>
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>License summary</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Zone entries</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Configuration definitions</td>
            </tr>      
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Zoning summary</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Switch summary</td>
                  <td bgcolor="#FFFFFF" width="23"><!--<input type="checkbox" name="">--></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap></td>
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Port use and device count</td>
                  <td bgcolor="#FFFFFF" width="23"><!--<input type="checkbox" name="">--></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap></td>
                  <td bgcolor="#FFFFFF" width="23"><!--<input type="checkbox" name="">--></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap></td>
            </tr>            
            </table>
            </td>
      </tr>
      </table>      
</div>

<div id="level03" style="position: absolute; visibility: hidden; z-index: 2; left:166; top: 440;">
      <table cellpadding=0 cellspacing=2 border=0 width=594 bgcolor="teal">
      <tr>
            <td>            
            <table cellpadding=0 cellspacing=0 border=0 width=594>
            <tr>
                  <td bgcolor="#FFFFFF" colspan="6" class="mysanTitles"><div class="subHead2">Step 2(3):  Select data to display.</div><br></td>
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="198" colspan=2><font color="teal">Totals across selected Switches</font></td>
                  <td bgcolor="#FFFFFF" width="396" colspan=4><font color="teal">Data for each selected Switches</font></td>                  
            </tr>      
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Switch summary</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Port Use</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Error logging information</td>
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Switch port usage summary  </td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Alert search</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Switch identification</td>
            </tr>      
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Device summary</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Switch I/O configuration</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Switch status information</td>
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">License summary</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Port connection information</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Performance information</td>
            </tr>      
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">Frame level statistics</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF">ISL map</td>
                  <td bgcolor="#FFFFFF" width="23"><!--<input type="checkbox" name="">--></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF"></td>
            </tr>            
            </table>
            </td>
      </tr>
      </table>
</div>
<body>
<div class="bodySection">
<H5>View</H5>
<!-- ********************* new table content starts here for mySAN ************************-->
<form name="main">
<table cellpadding=0 cellspacing=2 border=0 width=594 bgcolor="teal" valign=top>
<tr>
      <td>
      <table cellpadding=0 cellspacing=0 border=0 width=594>
      <tr>
            <td class="mysanTitles" bgcolor="#FFFFFF">                                                            
                  <div class="subHead2">Step 1:</div>
                  <img href="/content/images/bc/transparent.gif" width=1 height=5><br>
                  <div class="mysanTitles">SAN</div>
                  <select name="selectSAN" class="mysanTitles" size=3 multiple onClick="return manageSAN();">
                  <option value="ALL">ALL</option>
                  <option value="Corporate HDQ Finance">Corporate HDQ Finance Corporate HDQ Finance Corporate </option>
                  <option value="Toronto HDQ Failover">Toronto HDQ Failover</option>
                  <option value="EMEA IS OPS">EMEA IS OPS</option>
                  <option value="LATAM IS OPS">LATAM IS OPS</option>
                  </select>
            </td>      
      </tr>
      <tr>
            <td class="mysanTitles" bgcolor="#FFFFFF">                        
                  <img href="/content/images/bc/transparent.gif" width=1 height=5><br>
                  <div id="grey01" style="color: #CCCCCC;" class="mysanTitles">Fabric</div>
                  <select name="selectFabric" class="mysanTitles" size=3 multiple onClick=manageFAB(); disabled>
                  <option value="ALL">ALL</option>
                  <option value="Fabric1">Fabric 1 Fabric 1 Fabric 1 Fabric 1 Fabric 1 Fabric 1 Fabric 1</option>
                  <option value="Fabric2">Fabric 2</option>
                  <option value="Fabric3">Fabric 3</option>
                  <option value="Fabric4">Fabric 4</option>
                  </select>
                  <br>
            </td>      
      </tr>      
      <tr>      
            <td class="mysanTitles" bgcolor="#FFFFFF">
                  <img href="/content/images/bc/transparent.gif" width=1 height=5><br>
                  <div id="grey02" style="color: #CCCCCC;" class="mysanTitles">Switches</div>
                  <select name="selectSwitch" class="mysanTitles" size=3 multiple onClick=manageSWH(); disabled>
                  <option value="ALL">ALL</option>
                  <option value="sw1ap002">sw1ap002sw1ap002sw1ap002sw1ap002[10.117.180.32][10:00:00:60:69:80:53:2e]</option>
                  <option value="sw1ap002">sw1ap002</option>
                  <option value="sw1ap002">sw1ap002</option>
                  <option value="sw1ap002">sw1ap002</option>
            </select>
            <br><br>
            </td>
      </tr>
      </table>
      </td>
</tr>
</table>
<br>
<table cellpadding=0 cellspacing=2 border=0 width=594 height=170>
<tr>
<td>
      <div id="level01" style="position: absolute; visibility: visible; z-index: 2; left:166; top: 440;">
      <table cellpadding=0 cellspacing=2 border=0 width=594 bgcolor="teal">
      <tr>
            <td>
            <table cellpadding=0 cellspacing=0 border=0 width=594>
            <tr>
                  <td bgcolor="#FFFFFF" colspan="6" class="mysanTitles"><div class="subHead2">Step 2(1):  Select data to display.</div><br></td>
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="198" colspan=2><font color="teal">Totals across selected SANs</font></td>
                  <td bgcolor="#FFFFFF" width="396" colspan=4><font color="teal">Data for each selected SANs</font></td>                  
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Fabric summary</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>SAN Health report </td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Inventory status</td>
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Switch port usage summary</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>SAN diagram</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Best practices recommendations</td>
            </tr>      
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>License summary</td>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Switch summary</td>
                  <td bgcolor="#FFFFFF" width="23"><!--<input type="checkbox" name="">--></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap></td>
            </tr>
            <tr height=25>
                  <td bgcolor="#FFFFFF" width="23"><input type="checkbox" name=""></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap>Port use and device count</td>
                  <td bgcolor="#FFFFFF" width="23"><!--<input type="checkbox" name="">--></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap></td>
                  <td bgcolor="#FFFFFF" width="23"><!--<input type="checkbox" name="">--></td>
                  <td width="175" class="mysanTitles" bgcolor="#FFFFFF" nowrap></td>
            </tr>      
            </table>
            </td>
      </tr>
      </table>
      </div>
</td>
</tr>
</table>
<br>
<table cellpadding=0 cellspacing=0 border=0>
<tr>
      <td>&nbsp;</td>
</tr>
<tr>
      <td><input type="button" name="SanSearch" value="Search"></td>
</tr>
<tr>
      <td>&nbsp;</td>
</tr>
<tr>
      <td><div class="subHead2">Results</div></td>
</tr>
</table>
</form>



<!--************************ new table content ends here for mySAN ************************-->

</div>
</body>
</html>
0
Comment
Question by:894359
  • 7
  • 3
  • 3
13 Comments
 

Author Comment

by:894359
ID: 10786115
Works correctly in Netscape but not in IE!
0
 

Author Comment

by:894359
ID: 10786262
First time in IE the below function returns  false:

function selSAN(){
     
     for(i=0; i < document.main.selectSAN.length ; i++)
     {
          if (document.main.selectSAN.options[i].selected ==  true)
          return true;    
     }
     return false;
}
0
 
LVL 33

Expert Comment

by:knightEknight
ID: 10786289
change this:
   for(i=0; i < document.main.selectSAN.length ; i++)

to this:
   for( i=0; i < document.main.selectSAN.options.length; i++)
0
Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

 
LVL 63

Accepted Solution

by:
Zvonko earned 500 total points
ID: 10786304
Use onChange instead of onClick.
Like this:

               <select name="selectFabric" class="mysanTitles" size=3 multiple onChange="manageFAB();" disabled>

I do also not see a reason for MULTIPLE selections.

0
 
LVL 33

Expert Comment

by:knightEknight
ID: 10786305
or better, just remove the for-loop and do this:

function selSAN(){
     return document.main.selectSAN.selectedIndex >= 0;
}
 
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 10786312
I mean: change BOTH onClicks to onChange

0
 
LVL 63

Expert Comment

by:Zvonko
ID: 10786329
kEk recomandation can be extended to this:

function manageSAN(){
//    if (selSAN() == true) {
     document.main.selectFabric.disabled = false;
     document.getElementById("grey01").style.color = "#000000";
//     }
 return true;
}
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 10786336
Because there is NO selected which is ignored, so why check?
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 10786448
Thanks for points.

But why did you not make a split?
Two experts helped you.

If you want, then the split can still be made.
0
 

Author Comment

by:894359
ID: 10786512
Actually I didn't split because their solution didn't solve my problem all the way. I still had issues after trying theirs. Also knightEknight proposed solutions didn't work at all for me???
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 10786567
Ok, it's your decision.
But I still think that his checking simplification will help you (if you want to use it).
0
 
LVL 33

Expert Comment

by:knightEknight
ID: 10786605
no worries Z, all I did was make some quick syntactical observations.  We were both posting fast, and before I actually began to analyze the problem I saw your onclick-to-onchange suggestion and realized I need not go on.  
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 10786671
It's ok. Me too, when I first saw the onClick I did not look futher for the unnecessary loop.
0

Featured Post

Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

Question has a verified solution.

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

Suggested Solutions

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

839 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