How to Search JSON Tree with Jquery

How to search JSON tree with jQuery

var json = {
    "people": {
        "person": [{
            "name": "Peter",
            "age": 43,
            "sex": "male"},
        {
            "name": "Zara",
            "age": 65,
            "sex": "female"}]
    }
};
$.each(json.people.person, function(i, v) {
    if (v.name == "Peter") {
        alert(v.age);
        return;
    }
});

Example.

Based on this answer, you could use something like:

$(function() {
    var json = {
        "people": {
            "person": [{
                "name": "Peter",
                "age": 43,
                "sex": "male"},
            {
                "name": "Zara",
                "age": 65,
                "sex": "female"}]
        }
    };
    $.each(json.people.person, function(i, v) {
        if (v.name.search(new RegExp(/peter/i)) != -1) {
            alert(v.age);
            return;
        }
    });
});

Example 2

jQuery search JSON for a particular value

Please try this:

$('#search').keyup(function() {
    var searchField = $('#search').val();
    $.getJSON('https://api.myjson.com/bins/59t77', function(data) {
    console.log(data);
        var output = '<ul class="searchresults">';
        $.each(data.colors, function(k, obj) {
            if(obj[searchField]) {
                output += '<li>' + obj[searchField] + '</li>';
            }
        });
        output += '</ul>';
        $('#result').html(output);
    });  
});

With some more explanation on your specific issue, I may be able to assist you in better alternatives.

Demo: https://jsfiddle.net/iRbouh/0z228fya/

How to search JSON string using JQuery

This should get the job done

function FilterTree(arr, searchField, searchValue, subSearchField,  results, parentArr){
    for (var i=0 ; i < arr.length ; i++) {
        if (arr[i][searchField] == searchValue) {
            if(parentArr === undefined) results.push(arr[i]);
            else parentArr[subSearchField].push(arr[i]);

        }else if(arr[i][subSearchField] !== undefined){
            var par = JSON.parse(JSON.stringify(arr[i]))
                par[subSearchField] = []

            FilterTree(arr[i][subSearchField], searchField, searchValue, subSearchField,  results, par)
        }
    }       

    if(parentArr !== undefined && parentArr[subSearchField].length) results.push(parentArr)
    return results
    }

This will A) loop through the top-level. If a match is found it will be added to the results tree

B) If the top level has the specified child then the function will be called again with the child as the top level and the parent (OP) added to another array. Then if a match is found in the child it will be added to the OP before the OP is added to the results tree at the end of the loop

Example call:

FilterTree(tree, "Area", "Hollywood", "Branches", [])

Where "tree" is your original JSON object

use jQuery's find() on JSON object

jQuery doesn't work on plain object literals. You can use the below function in a similar way to search all 'id's (or any other property), regardless of its depth in the object:

function getObjects(obj, key, val) {
    var objects = [];
    for (var i in obj) {
        if (!obj.hasOwnProperty(i)) continue;
        if (typeof obj[i] == 'object') {
            objects = objects.concat(getObjects(obj[i], key, val));
        } else if (i == key && obj[key] == val) {
            objects.push(obj);
        }
    }
    return objects;
}

Use like so:

getObjects(TestObj, 'id', 'A'); // Returns an array of matching objects

Reading a particular value from a JSON tree using jQuery

I would use Array.prototype.map for this:

 var result = data.Sheet1.Month.map(function(obj){
    return Object.values(obj)[0]['D'];
});

new filter requirement

var result = data.Sheet1.Month.filter(function (month) {
    return Object.keys(month)[0] !== 'BL';
}).map(function(obj){
    return Object.values(obj)[0]['D'];
});    

Searching through JSON array using JavaScript/jQuery

There you go. Please find the fiddle here

By using a function like below:

function getLocality(){
    for(var i = 0 ; i< address_components.length; i++){
        var obj = address_components[i];
        var arr = obj["types"];
        for(var j = 0; j<arr.length;j++ ){
            if(arr[j] == "locality"){
                return obj;
            }
        }

    }
}

Or rather writing the Array prototype that does the same

Array.prototype.getByType = function(type){
    for(var i = 0 ; i< address_components.length; i++){
        var obj = address_components[i];
        var arr = obj["types"];
        for(var j = 0; j<arr.length;j++ ){
            if(arr[j] == type){
                return obj;
            }
        }

    }
}

And Using the Prototype as below:

address_components.getByType("administrative_area_level_1").long_name // Note that you pass the type to the prototype function that does the job for you

where address_components is the Array returned by the Google Maps

jSON tree search with jQuery, error

It's because json.result.matches.players is undefined and jQuery.each() doesn't have any checks for the first argument being undefined, it instead assumes you're passing it something valid that it can access the length property of.

In your JSON json.result.matches is an array of objects (each one representing a match), and each of those objects has a players property; the array itself does not have a players property. You need to iterate through each of the matches first, then through each of its players:

$.each(json.result.matches, function(index, match) {
    $.each(match.players, function(i, v) {
        // code here
    });
});

Alternatively just check the players for a particular match (in this case, the first one):

$.each(json.result.matches[0].players, function(i, v) {
    // code here
});

You should also move away from synchronous AJAX calls (such a ridiculous notion...) and instead call functions with your data processing logic from the success callback function, passing the JSON in.

---

Related Topics