Whats wrong with this JavaScript if statement?

Question

The function runs when the user presses enter in the textbox (KeyCode === 13) but i cant get it to work with searchButton

function myFunction(e) {
    if(e.keyCode === 13 || document.getElementById("searchButton").click()){
        e.preventDefault();
        var searchValue = document.getElementById("mySearch").value;
        for(var i = 0; i < users.length; i++){
        if(users[i]['last_name'] === searchValue){
        document.getElementById("return").innerHTML = JSON.stringify(users[i]);
        return;
        }
     }  
  }
}

<input type="search" id="mySearch"  onkeypress="myFunction(event)" />
<button id="searchButton" onclick="myFunction(e)">SEARCH</button>

Is the problem the || expression? The function should run either when the user presses searchButton or presses enter.

JavaScript .click() always returns undefined

Blazemonger
– Blazemonger

2017-02-06 22:34:10 +00:00
Commented Feb 6, 2017 at 22:34 — Blazemonger
– Blazemonger, Commented Feb 6, 2017 at 22:34
check for e.type == 'click' && this.id=='searchButton'

Jaromanda X
– Jaromanda X

2017-02-06 22:36:56 +00:00
Commented Feb 6, 2017 at 22:36 — Jaromanda X
– Jaromanda X, Commented Feb 6, 2017 at 22:36

Dancrumb · Accepted Answer · 2017-02-09 03:20:08Z

7

The call to document.getElementById("searchButton").click() is a programmatic way to simulate a click.

What you probably mean to do is:

function myFunction(e) {
    if((e.target.id === 'mySearch' && e.keyCode === 13) || e.target.id === 'searchButton'){

    }
}

edited Feb 9, 2017 at 3:20

answered Feb 6, 2017 at 22:31

Dancrumb

27.7k10 gold badges79 silver badges139 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

gezer4000 Over a year ago

Update This does not work for some reason... I have no idea why as it seems like it should totally work... JsFiddle

Dancrumb Over a year ago

There was a missing parenthesis... sorry about that.

Phillip · Accepted Answer · 2017-02-06 22:35:23Z

Ok so when you press the enter key myFunction is called with an event which has the keyCode property, so that is all good.

When you click the button though, the event does not have a keyCode property, and therefore the right side of your conditional document.getElementById("searchButton").click() runs. click is a method that simulates a mouseclick, returning undefined. So the conditional resolves to false, and the rest of the function body will not be run.

You could instead check the type of the event.

Collectives™ on Stack Overflow

Whats wrong with this JavaScript if statement?

2 Answers 2

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Related