JavaScript not excuting on any of my projects

Question

Bear with me as I am new to web development, I was working on a web based application and noticed that even simple JavaScripts were not running on my JSP page. I am trying to implement something similar to this: http://jsfiddle.net/chriscoyier/bphze/76/ I even created a fresh new project to make sure the problem isn't with my code. Here is that fresh page:

<html>
<script type="text/javascript">
<!--
//JavaScript goes here
var checkboxes = $("input[type='checkbox']"),
submitButt = $("input[type='submit']");
checkboxes.click(function() {
submitButt.attr("disabled", !checkboxes.is(":checked"));
});
//-->
</script>
<h1>Button should be enabled if at least one checkbox is checked</h1>
<form>
<div>
    <input type="checkbox" name="option-1" id="option-1"> <label for="option-1">Option 1</label>
</div>
<div>
    <input type="checkbox" name="option-2" id="option-2"> <label for="option-2">Option 2</label>
</div>
<div>
    <input type="checkbox" name="option-3" id="option-3"> <label for="option-3">Option 3</label>
</div>
<div>
    <input type="submit" value="Do thing" disabled>
</div>
</form>
</html>

Even a code as simple as the one above isn't executing. What am I missing here ?, do I need to import something into my project files ? Please advise, I am using NetBeans, and running the project on Firefox.

you haven't included jQuery.. include jQuery.. then use `document.ready()` call — Sudhansu Choudhary, Feb 10 '16 at 10:52
1.) add jquery lib 2) put the scripts in head block. 3) use doc ready block to put your script. — Jai, Feb 10 '16 at 10:53

score 0 · Answer 1 · answered Feb 10 '16 at 10:56

As of others have pointed out, if you haven't included jQuery, you need to do so in order to use statements like

 $("input[type='checkbox']")

You can do this by adding this line to your html file before your current script. Make sure it's surrounding with the html tags

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

Also, at the top of your file you have the opening of an html comment

<!--

Try removing that

Thanks, you are right, it seems I was missing this line. – Ahmad Labib Mansour Feb 10 '16 at 11:10 — Ahmad Labib Mansour, Feb 10 '16 at 11:10

score 0 · Accepted Answer · answered Feb 10 '16 at 10:59

There are a number of things wrong with your code and not only related to the execution of your JavaScript.

Try this revised code:

<!doctype html>

<html>

    <head>
        <title>My Page</title>
    </head>

    <body>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

        <script>
        $(function() {

            'use strict';

            var checkboxes = $("input[type='checkbox']"),
                submitButt = $("input[type='submit']");

            checkboxes.on('click', function() {
                submitButt.attr("disabled", !checkboxes.is(":checked"));
            });

        });

        </script>

        <h1>Button should be enabled if at least one checkbox is checked</h1>

        <form>
            <div>
                <input type="checkbox" name="option-1" id="option-1"> <label for="option-1">Option 1</label>
            </div>
            <div>
                <input type="checkbox" name="option-2" id="option-2"> <label for="option-2">Option 2</label>
            </div>
            <div>
                <input type="checkbox" name="option-3" id="option-3"> <label for="option-3">Option 3</label>
            </div>
            <div>
                <input type="submit" value="Do thing" disabled>
            </div>
        </form>

    </body>

</html>

Some problems I corrected:

Inclusion of the jQuery library, which you seem to be wanting to use, but have not included.
Removal of HTML comment that could have affected JS execution.
DOM Ready shorthand for jQuery code.
Use strict statement for correct JS execution.
HTML fixes, like adding a head and body correctly along with a doctype.

Thanks, that worked, I will make sure to avoid those mistakes next time. — Ahmad Labib Mansour, Feb 10 '16 at 11:14
No problem! Hopefully you can learn from this. Try to go through it line by line and if you have any questions, just ask! — Michael Giovanni Pumo, Feb 10 '16 at 11:16

JavaScript not excuting on any of my projects

2 Answers2