-1

I have this function on my page:

function selected(elmnt, name, id2check) {
        var x = document.getElementById(id2check).checked;
        if(x == false) {
                elmnt.style.backgroundColor = "#18436C";
                name.style.color = "#f9FfFf";
                document.getElementById(id2check).checked = true;
        } else {
                elmnt.style.backgroundColor = "transparent";
                name.style.color = "#18436C";
                document.getElementById(id2check).checked = false;
        }
    }

The first param passed is "this" which doesn't require quotation marks. The other two are the id names of a div and an input (checkbox) respectively. The only way the function works is if the third parameter has quotation marks but the second parameter doesn't. Why is that? 

    <div id="abbsmalone_container" onclick="selected(this, abbsmalone_name, 'abbsmalone_select')">
<input type="checkbox" class="selections" name="abbsmalone_select"  id="abbsmalone_select" value="yes" checked='checked' >
thinkofacard
  • 491
  • 1
  • 6
  • 19
  • 3
    Strings are quoted, variables aren't. – j08691 Jul 01 '15 at 21:08
  • ***this*** is not a normal variable, it's a javascript operator. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this – David Corbin Jul 01 '15 at 21:10
  • But what is the difference between the second and third parameter? Are they not both strings? – thinkofacard Jul 01 '15 at 21:11
  • 1
    I have a feeling the second argument here is not a string but is actually a global variable (a reference to an element) because of what's discussed in [this question](https://stackoverflow.com/questions/6381425/is-there-a-spec-that-the-id-of-elements-should-be-made-global-variable). – James Allardice Jul 01 '15 at 21:12
  • Can you create an example of the issue you're experiencing on jsFiddle.net? – j08691 Jul 01 '15 at 21:13
  • "x" is a string literal. x is a variable reference - which might contain a string, or it might contain any other object. In this case, abbsmalone_name is most likely the id of a different dom element, so it's referring to the actual DOM object. – Chris Tavares Jul 01 '15 at 22:40

1 Answers1

1

Thats because id2check a String type. All String type have to be used with"" or '' notation while assigning the value to a variable of String type, either it's got to be using "" or '' or else should be of type String. One more thing, you don't need to use this, if(x == false) here x is a boolean so the condition should be if(!x) thus you code would look like,

function selected(elmnt, name, id2check) {
        var x = document.getElementById(id2check).checked;
        if(!x) {
                elmnt.style.backgroundColor = "#18436C";
                name.style.color = "#f9FfFf";
                document.getElementById(id2check).checked = true;
        } else {
                elmnt.style.backgroundColor = "transparent";
                name.style.color = "#18436C";
                document.getElementById(id2check).checked = false;
        }
    }

Here, elmnt is an object type hence you don't need to use "" or '' and thus you use this. You use "" or '' with things which are of type String.

One more thing,you are using name.style.color which says even name is not of String type and it is an object. You pass a String to document.getElementById(), that is you pass an id, an html element id, which is of String type, hence here, elmnt is of type Object, name is of type Object and id2check is of String type. Hence, use a "" or '' for id2check

Sudhansu Choudhary
  • 3,322
  • 3
  • 19
  • 30
  • Thank you for your well thought out response. I'm still a bit confused what makes the second param an object. I'm new to js so the term "object" means something different me (php). Since I was passing in the name of a div I figured it would be a string just the third param. I guess in js it's type depends on how it's used in the function and not what it references? – thinkofacard Jul 01 '15 at 22:30
  • "All String type have to be used with`""` or `''` notation." That may be confusing. A variable can have a string value; in that case you wouldn't use quotation marks, but it would still be accepted as a string. For example, instead of `selected(this, abbsmalone_name, 'abbsmalone_select')` you could have written `var myString = 'abbsmalone_select'; selected(this, abbsmalone_name, myString)`. – David Knipe Jul 01 '15 at 22:30
  • @DavidKnipe I agree with you, what I meant was while assigning the value to a variable to a String type, either it's got to be using `""` or `''` or else should be of type `String`. Understand that could be misleading. – Sudhansu Choudhary Jul 01 '15 at 22:35
  • @thinkofacard, what makes `name` an object is the way you have implemented it here. e.g., if it was a `String` you would have said, `document.getElementByID("name").style.color`. but since you are using `name.style.color`, it proves it's an object as the property `.style` would act only on a DOM element(which is an element). So, it seems `name` is an object. – Sudhansu Choudhary Jul 01 '15 at 22:43
  • @thinkofacard, Sudhansu Choudhary wasn't saying that the javascript interpreter thinks like that when trying to deduce the type of a variable/term. He was only saying that he, Sudhansu, could see that whoever wrote `selected` was expecting `name` to be an object. I think he confused you into thinking there's some kind of weirdness like Perl context, hence the last sentence in your first comment on this answer. I don't think this is very different from PHP: objects are passed by reference, and typing is dynamic (i.e. any variable can be assigned any value, whatever its type). – David Knipe Jul 01 '15 at 23:02
  • 1
    Okay I think it have it. If the value passed isn't an object then what's inside the function wouldn't work. The odd part is that what is being passed in hasn't really been defined at all until it's passed. It's just a word. Kind of like quantum physics lol. – thinkofacard Jul 02 '15 at 22:06
  • Glad that you have got it. I don't know much about quantum physics though :D – Sudhansu Choudhary Jul 03 '15 at 11:13