Trying to match array values to input value but returns false in jQuery

Question

I've been trying to match an array list of numbers to an input number value, but every time it goes the loop it doesn't seems to find a match at all. So the scenario is if input2 is matched to any of the values of input1 then it should show the alerts in the if statements.

Am I missing something pretty obvious here?

var inputValues = ["1", "2", "3", "4", "5"]
var input1Val = $("#input1").val(inputValues);
      
function saveBtn() {
  var input2Val = $('#input2').val();
  var isMatched = false;
  for (var i = 0; i < inputValues.length; i++) {
    if(inputValues[i] === input2Val) {
      var isMatched = true;
    } else {
      isMatched = false;
    }
  }

  if(isMatched) {
    alert('is matched and should save');
  } else {
    alert('Is not matched! Error!');
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="input1" id="input1" /> <br /> <br />
<input type="text" name="input2" id="input2" value="" placeholder="Enter any above shown above"/>
<button type="submit" onclick="saveBtn()">Save Value</button>

@alexmac I checked both typeof() both are strings.

MrNew
– MrNew

2017-08-22 08:53:51 +00:00
Commented Aug 22, 2017 at 8:53 — MrNew
– MrNew, Commented Aug 22, 2017 at 8:53
Care to explain for downvote!...

MrNew
– MrNew

2017-08-22 08:57:33 +00:00
Commented Aug 22, 2017 at 8:57 — MrNew
– MrNew, Commented Aug 22, 2017 at 8:57

score 5 · Accepted Answer · 2017-08-22 08:55:15Z

5

Change it to:

if(inputValues[i] === input2Val) {
  isMatched = true; // Notice that "var" should not be added here
  break; // Not necessary, but will speed up your code
} else {
  //isMatched = false; // Remove this line
}

edited Aug 22, 2017 at 8:55

answered Aug 22, 2017 at 8:52

user8305166

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

3 Comments

Suresh Atta Over a year ago

And also break the loop please ?

user8305166 Over a year ago

@ꜱᴜʀᴇꜱʜᴀᴛᴛᴀ. added.

Suresh Atta Over a year ago

Good one, or remove the else part completely without break. That too works. Have an upvote.

Suresh Atta · Accepted Answer · 2017-08-22 08:52:01Z

You have 2 problems here.

1) You have to break the loop once found.

2)You are creating a new variable isMatched instead of updating already existing variable. Remove the var and it should works.

var inputValues = ["1", "2", "3", "4", "5"]
var input1Val = $("#input1").val(inputValues);
      
function saveBtn() {
  var input2Val = $('#input2').val();
  var isMatched = false;
  for (var i = 0; i < inputValues.length; i++) {
    if(inputValues[i] === input2Val) {
      isMatched = true;
    }
  }

  if(isMatched) {
    alert('is matched and should save');
  } else {
    alert('Is not matched! Error!');
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="input1" id="input1" /> <br /> <br />
    <input type="text" name="input2" id="input2" value="" placeholder="Enter any above shown above"/>
    <button type="submit" onclick="saveBtn()">Save Value</button>

JMP · Accepted Answer · 2017-08-22 09:35:23Z

2

It works for 5, the last value you check against. Add break; if a match is found. And you should remove var from the loop - it does nothing. As your code is looking for a single match, the else part can be removed too.

So:

for (var i = 0; i < inputValues.length; i++) {
    if(inputValues[i] === input2Val) {
      isMatched = true;
      break;
    } 
  }

edited Aug 22, 2017 at 9:35

answered Aug 22, 2017 at 8:51

JMP

4,62117 gold badges34 silver badges44 bronze badges

2 Comments

Yamen Nassif Over a year ago

this wont fix it the var isMatched will never be true;

T.J. Crowder Over a year ago

@YamenNassif: Yes, it will; the var on that line is a no-op. But JonMark should also suggest removing it. There's also no point in setting it false inside the loop. It starts out false.

Erazihel · Accepted Answer · 2017-08-22 08:54:05Z

1

You should modify the isMatched value only on match, otherwise you will reset its value to false even if it matched for a prior value.

You can also break the for loop to avoid useless iterations:

for (var i = 0; i < inputValues.length; i++) {
  if(inputValues[i] === input2Val) {
    isMatched = true;
    break;
  }
}

var inputValues = ["1", "2", "3", "4", "5"]
var input1Val = $("#input1").val(inputValues);
      
function saveBtn() {
  var input2Val = $('#input2').val();
  var isMatched = false;
  for (var i = 0; i < inputValues.length; i++) {
    if(inputValues[i] === input2Val) {
      isMatched = true;
      break;
    }
  }

  if(isMatched) {
    alert('is matched and should save');
  } else {
    alert('Is not matched! Error!');
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="input1" id="input1" /> <br /> <br />
    <input type="text" name="input2" id="input2" value="" placeholder="Enter any above shown above"/>
    <button type="submit" onclick="saveBtn()">Save Value</button>

answered Aug 22, 2017 at 8:54

Erazihel

7,6456 gold badges34 silver badges56 bronze badges

1 Comment

MrNew Over a year ago

What -.- I added this in my code before posting and didn't work when I tested it :/ .. But that seems to fix it.

Yamen Nassif · Accepted Answer · 2017-08-22 08:53:21Z

0

remove the var from here

if(inputValues[i] === input2Val) {
      var isMatched = true;
    } else {
      isMatched = false;
    }

and make it like this

if(inputValues[i] === input2Val) {
      isMatched = true;break;
} else {
    // do something else
}

whats happening is that you are always decalring new isMatched variable so the original is always false.

edited Aug 22, 2017 at 8:53

answered Aug 22, 2017 at 8:50

Yamen Nassif

2,4962 gold badges28 silver badges50 bronze badges

4 Comments

T.J. Crowder Over a year ago

No, var has function scope, not block scope.

MrNew Over a year ago

That was my typo, I did remove var in the true statement and still returning false.

Yamen Nassif Over a year ago

as Suresh said you should break the loop take a look at the edit

Suresh Atta Over a year ago

now it should work as Yamen added break . Or check my answer ?

Nemani · Accepted Answer · 2017-08-22 08:53:38Z

0

if(inputValues[i] === input2Val) {
      var isMatched = true; //here is the problem
    } else {
      isMatched = false;
    }

it should be like

if(inputValues[i] === input2Val) {
      isMatched = true;
    } else {
      isMatched = false;
    }

answered Aug 22, 2017 at 8:53

Nemani

7826 silver badges12 bronze badges

1 Comment

MrNew Over a year ago

Nope, this wont fixed it. See answers below, there's no block scope in jquery/js.

Lalit · Accepted Answer · 2017-08-22 08:56:14Z

Removed var from isMatched inside loop.
Added break inside loop on successful match.

var inputValues = ["1", "2", "3", "4", "5"]
var input1Val = $("#input1").val(inputValues);
      
function saveBtn() {
  var input2Val = $('#input2').val();
  var isMatched = false;
  for (var i = 0; i < inputValues.length; i++) {
    if(inputValues[i] === input2Val) {
      isMatched = true; //Not initialized here. Removed var
      break; //added this to break out of loop.
    } 
  }

  if(isMatched) {
    alert('is matched and should save');
  } else {
    alert('Is not matched! Error!');
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="input1" id="input1" /> <br /> <br />
    <input type="text" name="input2" id="input2" value="" placeholder="Enter any above shown above"/>
    <button type="submit" onclick="saveBtn()">Save Value</button>

Amit Arya · Accepted Answer · 2017-08-22 09:13:24Z

Declare isMatched variable outside of function.

var inputValues = ["1", "2", "3", "4", "5"]
var input1Val = $("#input1").val(inputValues);
var isMatched = false;

function saveBtn() {
  var input2Val = $('#input2').val();
  var isMatched = false;
  for (var i = 0; i < inputValues.length; i++) {
  console.log(typeof(inputValues[i]), typeof(input2Val));
    if(inputValues[i] === input2Val) {
      isMatched = true;
    } 
  }
  console.log(isMatched)

  if(isMatched) {
    alert('is matched and should save');
  } else {
    alert('Is not matched! Error!');
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="input1" id="input1" /> <br /> <br />
    <input type="text" name="input2" id="input2" value="" placeholder="Enter any above shown above"/>
    <button type="submit" onclick="saveBtn()">Save Value</button>

var inputValues = ["1", "2", "3", "4", "5"]
var input1Val = $("#input1").val(inputValues);
var isMatched = false;

function saveBtn() {
  var input2Val = $('#input2').val();
  var isMatched = false;
  for (var i = 0; i < inputValues.length; i++) {
  console.log(typeof(inputValues[i]), typeof(input2Val));
    if(inputValues[i] === input2Val) {
      isMatched = true;
    } 
  }
  console.log(isMatched)

  if(isMatched) {
    alert('is matched and should save');
  } else {
    alert('Is not matched! Error!');
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="input1" id="input1" /> <br /> <br />
    <input type="text" name="input2" id="input2" value="" placeholder="Enter any above shown above"/>
    <button type="submit" onclick="saveBtn()">Save Value</button>

Collectives™ on Stack Overflow

Trying to match array values to input value but returns false in jQuery

8 Answers 8

3 Comments

Comments

2 Comments

1 Comment

4 Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

8 Answers 8

3 Comments

Comments

2 Comments

1 Comment

4 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related