Syntax Error in Basic Javascript Function

Question

I keep getting errors when debugging in IE. This is a basic hide function.

idHide is the id of the field to be hidden idCondition is the id of the reference field the condition is compared upon value is the value that would satisfy the condition

function hideOnCondition(idHide, idCondition, value)
{    
    if (document.getElementById[idCondition] = value)
    {    
        document.getElementById(idHide).style.display = "none";         
    }
    else
    {           
        document.getElementById(idHide).style.display = "";
    }
}

I always encounter the error in:

if (document.getElementById[idCondition] = value)

"the value of the property is null or undefined not a function object"

Then I tried changing "getElementById" with "all". then changed the brackets to parentheses, still nothing, only for the line to be highlighted in yellow.

Im sorry, I'm just stumped. Again, thank you all for understanding.

= should be ==. Also I have to admit I've never seen document.getElementById treated like an associative array — Federico klez Culloca
– Federico klez Culloca, Commented Mar 28, 2018 at 10:00
What is the syntax error? Please share a working snippet using <> in your toolbar. — gurvinder372
– gurvinder372, Commented Mar 28, 2018 at 10:15
There is no syntax error, there is a runtime error and it is listed in the question. The question's title is incorrect. — axiac
– axiac, Commented Mar 28, 2018 at 10:16

Hendry · Accepted Answer · 2018-03-28 10:09:44Z

1

You were using square brackets instead of parentheses
=== should be used for comparing not =

.

function hideOnCondition(idHide, idCondition, value)
{    
    if (document.getElementById(idCondition) === value) // <- fix here
    {    
        document.getElementById(idHide).style.display = "none";         
    }
    else
    {           
        document.getElementById(idHide).style.display = "";
    }
}

answered Mar 28, 2018 at 10:09

Hendry

9001 gold badge11 silver badges27 bronze badges

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

2 Comments

Reginald Maravilla Over a year ago

that I did not know, I was searching for other stuff about the code, but I didn't realize it was the equal sign. Thank you very much.

Hendry Over a year ago

@ReginaldMaravilla you're welcome, if this matches what you need then please accept it as an answer

Nephi · Accepted Answer · 2018-03-28 14:22:30Z

1

function myFunction(option, value, div) {

    //get the element you want to hide by it's ID
    var x = document.getElementById(div); 

    //if the option you selected is coresponding to the given value 
    //hide the earlier selected element
    if (option === value) {
        x.style.display = "none";
    } else {
        x.style.display = "block";
    }
}

This should do it.

edited Mar 28, 2018 at 14:22

answered Mar 28, 2018 at 10:07

Nephi

558 bronze badges

2 Comments

Andreas Over a year ago

While this code may answer the question, providing additional context regarding how and/or why it solves the problem would improve the answer's long-term value.

Reginald Maravilla Over a year ago

Thank you, I think I get what your code does. Ill try to apply it to mine,

Yosvel Quintero · Accepted Answer · 2018-03-28 10:13:34Z

0

Instead of an assignment you should use the comparison operator Identity / strict equality (===):

function hideOnCondition(idHide, idCondition, value) {
    const result = document.getElementById[idCondition] === value ? 'none' : '';
    document.getElementById(idHide).style.display = result;
}

answered Mar 28, 2018 at 10:13

Yosvel Quintero

19.1k5 gold badges39 silver badges47 bronze badges

Comments

gurvinder372 · Accepted Answer · 2018-03-28 10:18:26Z

0

Two issues I could see

using = instead of === and not comparing value instead only comparing the the output of document.getElementById[idCondition] with value.
using [] instead of invoking the function using ()

Although, none of these would cause the syntax error as you have claimed in your post.

You can simplify it as

var getEl = (id) => document.getElementById(id);
function hideOnCondition(idHide, idCondition, value)
{    
    getEl(idHide).style.display = getEl(idCondition).value == value ? "none" : "";
}

answered Mar 28, 2018 at 10:18

gurvinder372

68.6k11 gold badges78 silver badges98 bronze badges

Collectives™ on Stack Overflow

Syntax Error in Basic Javascript Function

4 Answers 4

2 Comments

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related