jQuery check if value of input is in array

Question

I'm trying to check if the value of an input field is in the array but it doesn't seem to work.

This is what I have tried:

var postcode1 = [];
    for (var i = 21000; i < 21999; i++) {
        postcode1.push({ val: i, text: i });        
    }
    console.log(postcode1);

    $('#fw_form_field_146').blur(function() {
        var val = $("#fw_form_field_146").val();
        if( $.inArray(val, postcode1) > -1 ) {
            alert('test');
        }
    });

The array is outputting in console.log but the check doesn't work when i fill in the input field.

Your array contains objects, but you're checking if a string is there. It won't ever be. — fdomn-m
– fdomn-m, Commented Oct 9, 2018 at 12:25

Mihai Alexandru-Ionut · Accepted Answer · 2018-10-09 12:39:47Z

Since postcode1 it's an array which contains val-text values, you have to use map method by passing a callback provided function as argument.

Also, you need to use Number constructor because the value returned from input it's a string and your given array contains primitive numbers

var postcode1 = [];
for (var i = 21000; i < 21999; i++) {
    postcode1.push({ val: i, text: i });        
}

$('#fw_form_field_146').blur(function() {
    var val = $(this).val();
    if( $.inArray(Number(val), postcode1.map(({val}) => val)) !== -1 ) {
        alert('test');
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="fw_form_field_146"/>

Another approach it to use includes method.

var postcode1 = [];
for (var i = 21000; i < 21999; i++) {
    postcode1.push({ val: i, text: i });        
}

$('#fw_form_field_146').blur(function() {
    var val = $(this).val();
    if(postcode1.map(({val})=> val).includes(Number(val))) {
        alert('test');
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="fw_form_field_146"/>

Thank you for the answer but the var val is empty when i fill in the input field the value needs to change when i leave the input box how can I do this? Thank you.

Shai Aharoni · Accepted Answer · 2018-10-09 12:28:18Z

0

Try using findIndex instead of inArray, which will allow you to have a more accurate search conditions. Like this:

 if (postcode1.findIndex((item) => item.val.toString() === val) > -1 ) {
            alert('test');
   }

answered Oct 9, 2018 at 12:28

Shai Aharoni

1,9671 gold badge13 silver badges26 bronze badges

Comments

Carsten Løvbo Andersen · Accepted Answer · 2018-10-09 12:32:46Z

Use this instead since you need to check on the objects in the array and not the array itself.

$('#fw_form_field_146').blur(function() {
  var val = $("#fw_form_field_146").val();
  if (postcode1.filter((e) => e.val == val).length > 0) {
    alert('test');
  }
});

Demo

var postcode1 = [];
for (var i = 21000; i < 21999; i++) {
  postcode1.push({
    val: i,
    text: i
  });
}

$('#fw_form_field_146').blur(function() {
  var val = $("#fw_form_field_146").val();
  if (postcode1.filter((e) => e.val == val).length > 0) {
    alert('test');
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="fw_form_field_146" />

Collectives™ on Stack Overflow

jQuery check if value of input is in array

3 Answers 3

1 Comment

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Related