JavaScript - Using "checked/unchecked checkbox" as "IF ELSE condition statement"

Question

Now I want to use "check/unchecked checkbox" as "IF condition statement".

Example: I want to make a chord analyzer based on the note(s) you hit. When you check a note (or some notes) on checkbox, then press the button under those checkboxes, the paragraph element should tell you about what chord you hit. But there's error on my writing at if ("error") statement. How to fix it?

Here's my code:

<!doctype html>
<html>
   <head>
      <script>
       function fungsi() {

         var c = document.getElementById("C").checked;
         var e = document.getElementById("E").checked;
         var f = document.getElementById("F").checked;
         var g = document.getElementById("G").checked;

         if (c.checked = true &&
           e.checked = true &&
           g.checked = true &&
           f.checked = false) {
           document.getElementById("chord").innerHTML = "C Chord";
         } else if (c.checked = true &&
           f.checked = true &&
           g.checked = false &&
           e.checked = false) {
           document.getElementById("chord").innerHTML = "F Chord";
         } else {
           alert("Under Development!");
         }
       }
      </script>
   </head>
   <body>
      <form>
         Note(s) That You Hit:<br>
         <input type=checkbox id="C">C<br>
         <input type=checkbox id="E">E<br>
         <input type=checkbox id="F">F<br>
         <input type=checkbox id="G">G
      </form>
      <button type=button onclick="fungsi()">The Chord Is</button>
      <p id="chord"></p>
   </body>
</html>

Also, it looks like you're getting the checked attribute in this line `var c=document.getElementById("C").checked`, then trying to get the checked attribute of c again here `c.checked`. You only need to do that once. — Charles Clayton, Sep 15 '15 at 15:16
THANKS!! so I just changed it into >> if (c==true && g==true..and so on).. it works! :D — Hudoyo Danumurti, Sep 15 '15 at 15:21
Coding style is a personal choice, but can I suggest that the style above is **extremely** hard to both read and edit. I'd recommend using any of the common styles instead. Regardless of what you do in your own code, when asking for help, use http://jsbeautifier.org or similar to convert your code into something others will be familiar reading. — T.J. Crowder, Sep 15 '15 at 15:21

score 2 · Accepted Answer · edited May 23 '17 at 11:45

if (c.checked=true) and similar should be simply if (c.checked).

if (f.checked=false) and similar should be simply if (!f.checked).

If you want, you can do if (c.checked==true) or if (c.checked===true), and similarly if (f.checked==false) or if (f.checked===false), but it's pointless the vast majority of the time. You already have a boolean value. Just if (c.checked) and if (!f.checked) is sufficient.

E.g.:

if (c.checked &&
    e.checked &&
    g.checked &&
    !f.checked) {
    document.getElementById("chord").innerHTML = "C Chord";
}

Separately, as crclayton points out, you either want:

var c=document.getElementById("C").checked;
var d=document.getElementById("E").checked;
// ...and so on..., and then:
if (c && e && g && !f)

or

var c=document.getElementById("C"); // <== No .checked
var d=document.getElementById("E"); // <==
// ...and so on..., and then:
if (c.checked &&
    e.checked &&
    g.checked &&
    !f.checked) {

JavaScript - Using "checked/unchecked checkbox" as "IF ELSE condition statement"

1 Answers1

Linked