Call function to prompt for password on button click

Question

I am trying to require a password to end an event and go back to the login page, but when I click the button nothing happens.

The function and button I am using are below. Note this is below the end of the form I am using to submit on to the next page.

<button id="exitBtn">End Event</button>

<script>
  var exitBtn = document.getElementById("exitBtn");
  exitBtn.addEventListener("click", password());

  function password() {
    var realPW = "<?php echo $pw ?>";
    var pword = prompt("Please enter your password:");
    if (realPW == pword) {
      self.location = "LoginBox.php"
    }
</script>

**Danger** You are exposing the password in the page's source code. This is not remotely secure. — Quentin, Jun 29 '17 at 16:05
I retyped the function rather than copy and paste, but the bracket is there in the actual code. And this is not going to be a public webpage, nor is the security of this internal application even the smallest bit important. — Archer, Jun 29 '17 at 16:13

score 0 · Accepted Answer · answered Jun 29 '17 at 16:03

When you use password() you are invoking the function imidiatly, you should use just password.

Your code would work if password ended with return password; so the addEventListener method would use it, but that is not the case. So your function returns undefined and what ends up happening is .addEventListener('click', undefined);.

Fixed code:

End Event

<script>
var exitBtn = document.getElementById("exitBtn");
exitBtn.addEventListener("click", password);

function password() {
    var realPW = "<?php echo $pw ?>";
    var pword = prompt("Please enter your password:");
    if (realPW == pword) {
        self.location = "LoginBox.php"
    }
}
</script>

Anyone cares to comment the downvote? Is it because I answered a question that has a duplicate? — Rikard, Jul 01 '17 at 19:23

Call function to prompt for password on button click

1 Answers1