Javascript Function Problem

Question

I tend to write my javascript as big blocks of code without many variable or functions but have decided to clean up my act! Below is an attempt at writing a cleaner version of a script that hides certain form elements depending on the value of a drop down box.

The script worked perfectly before I tried to tidy it up but now I cannot see where the problem is? Could anyone advise me of any problems with my syntax here. Apologies for the very specific post.

Thanks,

Rich

function hideTitle(hide){
    if(hide = "true"){
        document.admin.title.style.display="none";
        document.getElementById("titleText").style.display="none";
    };
    else if(hide = "false"){
        document.admin.title.style.display="inline";
        document.getElementById("titleText").style.display="inline";
    };
};

function hideSocMedLinks(hide){
    if(hide = "true"){
        document.admin.facebookLink.style.display="none";
        document.admin.twitterLink.style.display="none";
        document.getElementById("fbtext").style.display="none";
        document.getElementById("twittext").style.display="none";
    };
    else if(hide = "false"){
        document.admin.facebookLink.style.display="block";
        document.admin.twitterLink.style.display="block";
        document.getElementById("fbtext").style.display="inline";
        document.getElementById("twittext").style.display="inline";
    };
};

function hideWebLink(hide){
    if(hide = "true"){
        document.admin.webLink.style.display="none";
        document.getElementById("webtext").style.display="none";
    };
    else if(hide = "false"){
        document.admin.webLink.style.display="block";
        document.getElementById("webtext").style.display="inline";
    };
};

function toggleFormElements(){
    if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "homePage"){
        hideTitle("true");
        hideSocMedLinks("true");
        hideWebLink("true");
    };
    else if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "socialMedia"){
        hideTitle("false");
        hideSocMedLinks("false");
        hideWebLink("true");
    };
    else if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "webDesign"){
        hideTitle("false");
        hideSocMedLinks("true");
        hideWebLink("false");
    };
};

It's been sorted below - apologies for the lack of a working example. — RichieAHB
– RichieAHB, Commented Mar 23, 2011 at 17:19

Adam Crossland · Accepted Answer · 2011-03-23 17:14:02Z

2

You need to use double equals (==) to test for equality. The single equals that is currently in your if statements will assign the value that you think you are testing for and evaluate to true. In other words, for almost all values of 'hide' the if will execute, not just the value "true".

function hideSocMedLinks(hide){
    if(hide == "true"){
        document.admin.facebookLink.style.display="none";
        document.admin.twitterLink.style.display="none";
        document.getElementById("fbtext").style.display="none";
        document.getElementById("twittext").style.display="none";
    }
    else if(hide == "false"){
        document.admin.facebookLink.style.display="block";
        document.admin.twitterLink.style.display="block";
        document.getElementById("fbtext").style.display="inline";
        document.getElementById("twittext").style.display="inline";
    }
}

answered Mar 23, 2011 at 17:14

Adam Crossland

14.2k3 gold badges47 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

masylum Over a year ago

even better if you use triple equals! === stackoverflow.com/questions/3804005/…

Rion Williams · Accepted Answer · 2011-03-23 17:10:21Z

2

You have semi-colons (;) after your if statements - that could be the cause of your syntax issues. See the arrows below:

function hideTitle(hide){
    if(hide = "true"){
        document.admin.title.style.display="none";
        document.getElementById("titleText").style.display="none";
    }; <----
    else if(hide = "false"){
        document.admin.title.style.display="inline";
        document.getElementById("titleText").style.display="inline";
    }; <----
};

answered Mar 23, 2011 at 17:10

Rion Williams

76.9k38 gold badges206 silver badges335 bronze badges

1 Comment

RichieAHB Over a year ago

That in conjunction with the == faux pas sorted it out a treat thanks!

chills42 · Accepted Answer · 2011-03-23 17:12:30Z

Removing the unnecessary semi-colons should solve the issue.

function hideTitle(hide){
    if(hide = "true"){
        document.admin.title.style.display="none";
        document.getElementById("titleText").style.display="none";
    }
    else if(hide = "false"){
        document.admin.title.style.display="inline";
        document.getElementById("titleText").style.display="inline";
    }
}

function hideSocMedLinks(hide){
    if(hide = "true"){
        document.admin.facebookLink.style.display="none";
        document.admin.twitterLink.style.display="none";
        document.getElementById("fbtext").style.display="none";
        document.getElementById("twittext").style.display="none";
    }
    else if(hide = "false"){
        document.admin.facebookLink.style.display="block";
        document.admin.twitterLink.style.display="block";
        document.getElementById("fbtext").style.display="inline";
        document.getElementById("twittext").style.display="inline";
    }
}

function hideWebLink(hide){
    if(hide = "true"){
        document.admin.webLink.style.display="none";
        document.getElementById("webtext").style.display="none";
    }
    else if(hide = "false"){
        document.admin.webLink.style.display="block";
        document.getElementById("webtext").style.display="inline";
    }
}

function toggleFormElements(){
    if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "homePage"){
        hideTitle("true");
        hideSocMedLinks("true");
        hideWebLink("true");
    }
    else if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "socialMedia"){
        hideTitle("false");
        hideSocMedLinks("false");
        hideWebLink("true");
    }
    else if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "webDesign"){
        hideTitle("false");
        hideSocMedLinks("true");
        hideWebLink("false");
    }
}

SLaks · Accepted Answer · 2011-03-23 17:11:46Z

1

You shouldn't put ;s after code blocks.

In particular, the ;s after your ifs end the if blocks, causing the elses to be unattached.

answered Mar 23, 2011 at 17:11

SLaks

891k182 gold badges1.9k silver badges2k bronze badges

Comments

Michael Berkowski · Accepted Answer · 2011-03-23 17:13:25Z

1

Remove the semicolon after the closing } in all your if / else blocks. Also, are you passing the boolean value true/false to your function or are you passing the string "true"/"false"?

// This is incorrect
if (stuff) {
  // stuff
};
else if {
  // etc...
};

// Should be
if (stuff) {
  // stuff
}
else if {
  // etc...
}

answered Mar 23, 2011 at 17:13

Michael Berkowski

271k47 gold badges450 silver badges395 bronze badges

Comments

Zikes · Accepted Answer · 2011-03-23 17:16:21Z

1

As others have mentioned, the semicolons (;) after the closing braces (}) before each else should be removed, but one other problem I can see is that you're using a single equals inside your if statements. In Javascript a single equals sign will always attempt assign to the left hand side. What you want for comparisons is double or triple equals (== or ===).

answered Mar 23, 2011 at 17:16

Zikes

5,8861 gold badge32 silver badges44 bronze badges

Collectives™ on Stack Overflow

Javascript Function Problem

6 Answers 6

1 Comment

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

1 Comment

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related