CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Jakob Morelan
Jakob Morelan

Reputation: 11

Why is my jQuery code not working when I click the button?

I'm fairly new to JavaScript/jQuery and web programming. I have to textboxes and a button. I'm trying to make it so that when the textboxes have the right characters in them and you click the button, it takes you to another page. But when I click the button, nothing happens.

Here is a link to it on my server: http://jakadproductions.com/testing/

Sorry, I'm only 15.

My code:

$document.ready(function() {
  $("#login_button").click(function() {
    var username_value = document.getElementById("username_box").value;
    var password_value = document.getElementById("password_box").value;
    if (username_value == "JakobMorelan" && password_value == "Admin1234") {
      window.location = "http://jakadproductions.com/naj7m6j2aajre1o7opjr/";
    };
    else {
      window.location = "http://jakadproductions.com/";
    };
  });
});
<title>LOGIN</title>
<script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>

<h1>LOGIN</h1>
<input id="username_box" type="textbox" placeholder="Username" />
<input id="password_box" type="textbox" placeholder="Password" />
<button id="login_button">Submit</button>

Upvotes: 1

Views: 128

Answers (6)

supertrue
supertrue

Reputation: 2099

You appear to have two errors in your code—

  1. As others have mentioned, you have to remove the semicolon after your if {...} block. In JavaScript and many other languages, the standard syntax is if {...} else {...}.

  2. Your jQuery code begins with $document, where—unless var $document has been previously defined—you really need $(document). The document variable is globally available and doesn't itself need to be defined, but to use it with jQuery methods like .ready(...), you have to wrap it in the jQuery wrapper, which is what $(document) does.

Here's a Codepen example of it working. I have changed the redirects to alerts.

https://codepen.io/ericpedia/pen/qmmvNJ

Upvotes: 0

Francesco Di Stefano
Francesco Di Stefano

Reputation: 1

First of all, there is an error in the code. After your if statement (and before the else) you have put a semicolon ';'. First fix that, CTRL + SHIFT + J opens a console on Chrome, you can use to debug this kind of errors easily

Upvotes: 0

DanLatimer
DanLatimer

Reputation: 117

The browser debugger is a great tool to figure out these issues. When I opened the link to your testing page and opened the browser's debug tool it spit out the problem:

Uncaught SyntaxError: Unexpected token else

It's saying that it doesn't expect the else token because you put a semi colon after the if clause ending it. Since there was no if statement that was still ongoing the else was unexpected and the script crashed

Upvotes: 0

csim
csim

Reputation: 660

Your if/else block has an additional ; where none is expected!

Try and open the developer tools of your browser, it should give you a hint if there is something wrong with your code and a pointer to where the error is.

In this case remove the ; after the if statement

Upvotes: 0

user7948157
user7948157

Reputation: 13

The console is your friend. Looking at it would reveal this:

SyntaxError: expected expression, got keyword 'else'

Given you only have one else keyword in your code, you can assume it's that one. Immediately before that you have a semicolon which completely ends that conditional. Therefore the else is invalid because there's no longer an if that it's continuing from. Remove the semicolon and it will run.

Upvotes: 1

Himanshu dua
Himanshu dua

Reputation: 2513

Remove extra semi-colon after if 

if (username_value == "JakobMorelan" && password_value == "Admin1234") {
                window.location = "http://jakadproductions.com/naj7m6j2aajre1o7opjr/";
            }
            else {
                window.location = "http://jakadproductions.com/";
            };

Upvotes: 0

Related Questions