Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!
  • Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

JavaScript code breaks when I use a variable

noweare

Coder
Using a webpage to control leds connected to a microcontroller. Just using a variable to
substitute for document.getElementById('ID_LED_0')

EDIT: Also get err in console: DevTools failed to load source map: Could not load content for chrome-extension://gighmmpiobklfepjocnamgkkbiglidom/browser-polyfill.js.map: System error: net::ERR_FILE_NOT_FOUND

this works:
Code:
<scipt>
document.getElementById('ID_LED_0').addEventListener('click', led_changed);
document.getElementById('ID_LED_1').addEventListener('click', led_changed);
document.getElementById('ID_LED_2').addEventListener('click', led_changed);

function led_changed() {
    if(document.getElementById('ID_LED_1').checked == true) {
      l_LED_selected = 1;
    console.log(l_LED_selected);
    var msg = { type: 'LED_selected', value: l_LED_selected};
    Socket.send(JSON.stringify(msg));
}
</script>

But this doesn't

Code:
<script>
var led_1=document.getElementById('ID_LED_1');
led_1.addEventListener('click', led_changed);

function led_changed() {
    if(led_1.checked == true) {
      l_LED_selected = 1;
    console.log(l_LED_selected);
    var msg = { type: 'LED_selected', value: l_LED_selected};
    Socket.send(JSON.stringify(msg));
  } //EDIT WAS NOT PRESENT IN ORIGINAL POST 
}
</script>
 
Last edited:
I think you are missing at least one closing bracket there.
A bracket that looks like is closing the function, is actually closing the IF statement. Function is not closed in your code at all.

Make sure also, that you have declared properly whatever you are using in line l_LED_selected = 1;
 
I think you are missing at least one closing bracket there.
A bracket that looks like is closing the function, is actually closing the IF statement. Function is not closed in your code at all.

Make sure also, that you have declared properly whatever you are using in line l_LED_selected = 1;
Hello EkBass,
Thanks for responding. I missed the close bracket in the post but it is in the code. Just found out that when the code does not work I get the
"dev tools missing ..." msg in the console. When I change my code to what works that msg doesn't show up.
 
6:5 error Parsing error: Unexpected token 4 | 5 | function led_changed() { > 6 | if(led_1.checked == true) { | ^ 7 | l_LED_selected = 1; 8 | console.log(l_LED_selected); 9 | var msg = { type: 'LED_selected', value: l_LED_selected};

 
I think you are missing at least one closing bracket there.
A bracket that looks like is closing the function, is actually closing the IF statement. Function is not closed in your code at all.
And this is why I keep urging everybody to use Allman indentation style. The notion of not having brackets line up is IMO one of the worst ideas in programming history. If you use this style religiously your chances of silly errors like this will decrease dramatically.
 
this works:
Code:
<scipt>
document.getElementById('ID_LED_0').addEventListener('click', led_changed);
document.getElementById('ID_LED_1').addEventListener('click', led_changed);
document.getElementById('ID_LED_2').addEventListener('click', led_changed);

function led_changed() {
    if(document.getElementById('ID_LED_1').checked == true) {
      l_LED_selected = 1;
    console.log(l_LED_selected);
    var msg = { type: 'LED_selected', value: l_LED_selected};
    Socket.send(JSON.stringify(msg));
}
</script>
I would be very surprised if this works, seeing as you start off with a typo 😮
Always be very careful in typing and spelling, especially when writing HTML, CSS, or JS as there is no compiler to warn you.
 
LIke I said, I missed the bracket when I posted (cut & paste).

Yes, I am finding out that my spelling needs more scrutiny. Normally I am writing C in a dev environment that catches these things and as you can see I have become lax with my spelling.

Turns out the problem was not the code but I had to reload the page (sometimes) twice or close the page and type in the url to reload correctly. Kind of glitchy but I am working with a microcontroller serving a webpage.

I am just learning html, css and js. There seems to be many different ways to do a thing, which makes it confusing to me. Like I learned about 6 ways to to
do one thing rather than learning 6 things.
 
Yes there are always different ways to do things. The way that is easiest to understand is always the best - even if that may need a little more coding. E.g. I often prefer writing a few simple lines over using some power function whose myriad options I can never remember.
 

New Threads

Latest posts

Buy us a coffee!

Back
Top Bottom