Home » Javascript » Javascript code does not execute?

Javascript code does not execute?

Posted by: admin August 19, 2018 Leave a comment


I’m working on a project. I’m trying to make my code so that when a user submits an option from a dropdown menu, if the user selects and submits the default (“Select a genre”), the form is not submitted and the page is not refreshed. Following is my Javascript code:


    var menu = document.getElementById("submit");
        menu.addEventListener("click", function() {
            if (document.getElementById("dropdown").value == 'nothing')
                return false;


This is nested inside a head tag.

Following is my HTML code for the form:

    <form method="POST">
        <select id="dropdown" name="genre">
            <option value="nothing">Select a genre</option>
            <option value="rock">Rock</option>
        <input id="submit" type="submit"/>

The javascript doesn’t seem to work, since even when I submit the form while selecting the “Select a genre” option, my form is still submitted, and the python code does work on the value ‘nothing’, which gives errors.

EDIT: Upon adding further functionality to my project by adding more javascript code, the javascript code again didn’t work. I used google chrome’s developer tools and stumbled upon this error which seems to be related to why the code isn’t working:

Uncaught TypeError: $(...).addEventListener is not a function
    at (index):18