if vs switch

[reneecccwest]

Hello, Aren't they same conditional statment to show the resut?
but somehow "switch" condtional stmt always gets the default value when I excute?
what did I wrong?

<script language="JavaScript">
<!--
function showtype(obj) {
if (obj.options[obj.selectedIndex].value == "137")
{
document.getElementById('secID1').style.visibility = 'visible'
document.getElementById('brhID1').style.visibility = 'hidden'
document.getElementById('divID1').style.visibility = 'hidden'
document.getElementById('depID1').style.visibility = 'hidden'
}

else if (obj.options[obj.selectedIndex].value == "136")
{
document.getElementById('secID1').style.visibility = 'hidden'
document.getElementById('brhID1').style.visibility = 'visible'
document.getElementById('divID1').style.visibility = 'hidden'
document.getElementById('depID1').style.visibility = 'hidden'
}
else if (obj.options[obj.selectedIndex].value == "135")
{
document.getElementById('secID1').style.visibility = 'hidden'
document.getElementById('brhID1').style.visibility = 'hidden'
document.getElementById('divID1').style.visibility = 'visible'
document.getElementById('depID1').style.visibility = 'hidden'
}
else if (obj.options[obj.selectedIndex].value == "134")
{
document.getElementById('secID1').style.visibility = 'hidden'
document.getElementById('brhID1').style.visibility = 'hidden'
document.getElementById('divID1').style.visibility = 'hidden'
document.getElementById('depID1').style.visibility = 'visible'
}
else
{
document.getElementById('secID1').style.visibility = 'hidden'
document.getElementById('brhID1').style.visibility = 'hidden'
document.getElementById('divID1').style.visibility = 'hidden'
document.getElementById('depID1').style.visibility = 'hidden'
}

}
//-->
</script>

vs

<script language="JavaScript">
<!--
function showtype(obj) {
var selectfrmvalue = obj.options[obj.selectedIndex].value
switch (selectfrmvalue)
{
case 134:
document.getElementById('secID1').style.visibility = 'hidden'
document.getElementById('brhID1').style.visibility = 'hidden'
document.getElementById('divID1').style.visibility = 'hidden'
document.getElementById('depID1').style.visibility = 'visible'
break
case 135:
document.getElementById('secID1').style.visibility = 'hidden'
document.getElementById('brhID1').style.visibility = 'hidden'
document.getElementById('divID1').style.visibility = 'visible'
document.getElementById('depID1').style.visibility = 'hidden'
break
case 136:
document.getElementById('secID1').style.visibility = 'hidden'
document.getElementById('brhID1').style.visibility = 'visible'
document.getElementById('divID1').style.visibility = 'hidden'
document.getElementById('depID1').style.visibility = 'hidden'
break
case 137:
document.getElementById('secID1').style.visibility = 'visible'
document.getElementById('brhID1').style.visibility = 'hidden'
document.getElementById('divID1').style.visibility = 'hidden'
document.getElementById('depID1').style.visibility = 'hidden'
break
default:
document.getElementById('secID1').style.visibility = 'hidden'
document.getElementById('brhID1').style.visibility = 'hidden'
document.getElementById('divID1').style.visibility = 'hidden'
document.getElementById('depID1').style.visibility = 'hidden'
}
}
//-->
</script>

 

[Michael Winter]

Hello, Aren't they same conditional statment to show the resut?
but somehow "switch" condtional stmt always gets the default value when
I excute?
what did I wrong?

In the switch statement, you're comparing a string, selectfrmvalue, to
numbers. For example,

switch (selectfrmvalue)
{
case 134:
...

should be

switch (selectfrmvalue)
{
case '134':
...

<script language="JavaScript">

This should read

<script type="text/javascript">

The type attribute is required and is sufficient. The language attribute
is deprecated.

<!--

The practice of script hiding is obsolete. Remove SGML comment delimiters
from script blocks.

function showtype(obj) {
if (obj.options[obj.selectedIndex].value == "137")

You really should store that value in a local variable like you do in the
switch version. Not only is it faster, it's fewer bytes to download. You
could do same with the four identical getElementById() calls in each
branch: perform them once at the start, then alter the attributes.

Finally, you should terminate every statement with a semi-colon (. It's
good practice.

[snip]

Hope that helps,
Mike

 

[reneeccc west]

I tried, but it does not seem to be working.
did I do wrong again?

<script type="text/javascript">
function showtype(obj) {
var selectfrmvalue = parseInt(obj.options[obj.selectedIndex].value)
var getEsec = document.getElementById('secID1').style.visibility
var getEbrh = document.getElementById('brhID1').style.visibility
var getEdiv = document.getElementById('divID1').style.visibility
var getEdep = document.getElementById('depID1').style.visibility
switch (selectfrmvalue)
{
case 137:
getEsec = 'visible';
getEbrh = 'hidden';
getEdiv = 'hidden';
getEdep = 'hidden';
break
case 136:
getEsec = 'hidden';
getEbrh = 'visible';
getEdiv = 'hidden';
getEdep = 'hidden';
break
case 135:
getEsec = 'hidden';
getEbrh = 'hidden';
getEdiv = 'visible';
getEdep = 'hidden';
break
case 134:
getEsecy = 'hidden';
getEbrh = 'hidden';
getEdiv = 'hidden';
getEdep = 'visible';
break
default:
getEsec = 'hidden';
getEbrh = 'hidden';
getEdiv = 'hidden';
getEdep = 'hidden';
}
}
</script>

 

[Michael Winter]

I tried, but it does not seem to be working.
did I do wrong again?

<script type="text/javascript">
function showtype(obj) {
var selectfrmvalue = parseInt(obj.options[obj.selectedIndex].value)
var getEsec = document.getElementById('secID1').style.visibility
var getEbrh = document.getElementById('brhID1').style.visibility
var getEdiv = document.getElementById('divID1').style.visibility
var getEdep = document.getElementById('depID1').style.visibility

The "getE___" variables above will be primitives, with the same type as
Style.visibility. When you modify them, the changes won't be reflected in
the HTML document. What you need are references.

Try:

var getEsec = document.getElementById('secID1').style;

then alter the document with:

getEsec.visibility = 'visible';

If there are further problems, do ask.

Mike

 

[reneeccc west]

thank you, it works, but it is not clear to me why second one won't be
reflected in the HTML document.

var getEsec = document.getElementById('secID1').style;

vs

var getEsec = document.getElementById('secID1').style.visibility;

 

[Michael Winter]

thank you, it works, but it is not clear to me why second one won't be
reflected in the HTML document.

var getEsec = document.getElementById('secID1').style;

vs

var getEsec = document.getElementById('secID1').style.visibility;

The types string, boolean and number are primitive types. When they are
assigned to variables, the value is copied. Changes to that variable
affect that variable only. The property, visibility, is a string (a
primitive).

The types array and object are composite types. When they are assigned to
variables, a reference to that entity is assigned; no copy is made.
Because the variable points to the original entity, that entity is
altered. The property, style, is an object.

Consider this example:

var a = 'text';
var x = new Object;
x.t = 'text;

var b = a;
var y = x;

alert( 'a: ' + a + '\tb: ' + b + '\n' + 'x.t: ' + x.t + '\ty.t: ' + y.t
);
b = 'new text';
y.t = 'new text';
alert( 'a: ' + a + '\t\tb: ' + b + '\n' + 'x.t: ' + x.t + '\ty.t: '
+ y.t );

In the first alert box, you should see:

a: text b: text
x.t: text y.t: text

In the second:

a: text b: new text
x.t: new text y.t: new text

Even though 'y' was the one that was modified, 'x' was also changed. That
is because both 'x' and 'y' refer to the same object. 'a' kept its
original value because 'b' contained a separate copy of the value of 'a'.

Does that help?

Mike

 

[Lasse Reichstein Nielsen]

thank you, it works, but it is not clear to me why second one won't be
reflected in the HTML document.

var getEsec = document.getElementById('secID1').style;

This assigns an object to getEsec, the style object associated with
the element. You can change that object's properties, and the it will
be reflected in how the element looks, because the connection between
element and style object is not changed.

vs

var getEsec = document.getElementById('secID1').style.visibility;

This will assign a string to getEsec, a simple value. You can change
the value of the getEsec variable, but it won't be reflected in the
style object, and therefore not at all in how the element looks.

/L

 

[reneeccc west]

now i got it. Thank you for your clear explanation.