how to filter an array of objects with jQuery

Question

Recently I'm studying jQuery . I wish that when I write here <input type="text" id="scrivo" /> I want to filter an array derived from a json file. The json file is like this:

{
  "Re": 
[
  {
    "nm": "Edward the Elder",
    "cty": "GB",
    "hse": "House of Wessex",
    "yrs": "899-925"
  },
  {
    "nm": "Edgar",
    "cty": "GB",
    "hse": "House of Wessex",
    "yrs": "959-975"
  },
  {
    "nm": "Edward the Martyr",
    "cty": "GB",
    "hse": "House of Wessex",
    "yrs": "975-978"
  }
 ]
}

and the piece of code is this:

<script language="JavaScript">
$(document).ready(function()             
    {
      $('#scrivo').keyup(function()
        {
         var json = (function () {
         var json = null;
         $.ajax({
             'async': false,
             'global': false,
             'url': "re.json",
             'dataType': "json",
             'success': function (data) {
                 json = data;
             }
               });
             return json.Re;
         })();
         var o = $.grep(json, function (n) { return (n.nm.indexOf("El")) },true);
      });
 });
</script>

For example I would like to filter the objects that contain "El", which is the first object in the json file. Instead I do not receive anything. Can you help me please?

Forget my older comment, I didn't see you were using async : false. Maybe this question will help you? — blex
– blex, Commented Jul 26, 2014 at 15:57
ajax is asynchronous. You first return json.re, which is not defined, and after a while response comes from server. — Ivan Ivanov
– Ivan Ivanov, Commented Jul 26, 2014 at 16:02
It's because return n.nm.indexOf("El") should be return n.nm.indexOf("El") !== -1. The indexOf method returns an index, which is -1 when no match is found. So the first object returns a higher index and all the others return -1, all of which are "truthy" values. This means the condition always passes, and because you passed true as the third argument to $.grep, the condition is inverted, removing excluding all items. — cookie monster
– cookie monster, Commented Jul 26, 2014 at 16:18

sina72 · Accepted Answer · 2014-07-26 16:42:47Z

1

I found the bug: You have inverted the grep command. Here's a jsFiddle demonstrating my answer: http://jsfiddle.net/UqE5n/3/

The crucial line is here:

var value = $('#scrivo').val();
var o = $.grep(jsonRe, function (n) {
    return n.nm.indexOf(value) >= 0;
}, false);                                <--- "true" will invert the result!

It will also guide you how to use jsFiddle for asking with a code example. I am learning jsQuery myself, so thanks for the question!

answered Jul 26, 2014 at 16:42

sina72

5,1513 gold badges38 silver badges38 bronze badges

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

2 Comments

AlessandroG Over a year ago

Thanks! I tried with false but the results was wrong. So the point is >= 0

sina72 Over a year ago

happy to have helped you. please consider upvoting.

Collectives™ on Stack Overflow

how to filter an array of objects with jQuery

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related