How to search JSON in jQuery

Question

hello I have 3 DIVs that contain 1,2,3

<div>1</div>
<div>2</div> 
<div>3</div>

and have this JSON

[{
    "FactoreId:1": "FactoreItems:a, b, c, d, e"
}, {
    "FactoreId:2": "FactoreItems:g,f"
}, {
    "FactoreId:3": "FactoreItems:i, k, h"
}]

I want that when I hover over the DIVs that their values are checked.

If DIV contains 1 show the FactoreItems of "FactoreId:1": "FactoreItems:a, b, c, d, e", if it contains 2 show the FactoreItems of "FactoreId:2": "FactoreItems:g,f" and so on ....

Possible duplicate? http://stackoverflow.com/questions/4935632/how-to-parse-json-in-javascript — Kyle Muir, Oct 07 '13 at 09:49
Please elaborate on this question a bit more. What do you mean by 'factoreid 1 factoreitems'? Also, it would be helpful if you posted the HTML with your `div`s. — Bryce, Oct 07 '13 at 09:50
Do you get this JSON from another source in this form? If the structure is created by you, I would change the array to an Object and the keys to digits only for easier and more performant access. — Ferdinand Torggler, Oct 07 '13 at 09:54
yes, i get this JSON from another source, i want when hover div ,checked if div contain 1 , in JSON,show FactoreId1 FactoreItems.for example when hover
1
show me (with alert or anything) a, b, c, d, e — user2781200, Oct 07 '13 at 09:58

Anton · Accepted Answer · 2013-10-07T12:22:32.013

0

The JSON you posted is incorrect, fixed it so "FactoreId" : num, "FactoreItems": "string"

HTML

<div>1</div>
<div>2</div>
<div>3</div>

jQuery

 //Fixed JSON
 var factore = [{
       "FactoreId": 1, 
       "FactoreItems": "a, b, c, d, e"
   }, {
       "FactoreId": 2,
       "FactoreItems": "g,f"
   }, {
       "FactoreId": 3,
       "FactoreItems": "i, k, h"
   }]
    $('div').on('mouseover', function () {
        $(this).text("FactoreID : "+factore[$(this).text() -1].FactoreId +"FactoreItems"+ factore[$(this).text()-1].FactoreItems);
   });

DEMO

Explanation

factore : is the array with json

$(this).text() -1 returns divs number and -1 since array starts from 0

factore[$(this).text() - 1] 
// if you mouseover div with text one the result will be factore[0]
// then use .FactoreId to get id value

edited Oct 07 '13 at 12:22

answered Oct 07 '13 at 09:57

Anton

32,245
5
44
54

Can you tell me about the $('div').on('mouseover', function () { $(this).text("FactoreID : "+factore[$(this).text() -1].FactoreId +"FactoreItems"+ factore[$(this).text()-1].FactoreItems); }); ? – user2781200 Oct 07 '13 at 12:16
Note there's a hole in the logic here. You're simply getting the item in the array at that index, rather than looking up the individual item with a "FactoreId" of 1. If I swap the list so that "FactoreId" 3 is actually output first in the JSON, this breaks and you get the wrong data in the wrong cells. A more robust solution would be to find the proper array element where "FactoreId" is 1 and return that element of the array. – chsh Oct 07 '13 at 12:37
@chsh Well, that's true but i don't see any reason of having an unsorted json like that. But yes you are correct there is a hole but not that likley it would be unsorted – Anton Oct 07 '13 at 12:40
Consider a case where the IDs aren't all sent. What if your IDs were based on day of the month but we only retrieve a week at a time? What happens in this solution on the 28th of the month when we only have 7 days' worth of data? I can't really see a case outside of sample questions like this where this solution would practically work. – chsh Oct 07 '13 at 12:58
Well, a dynamic created list of items? It doesn't have to be connected to anything special, you could have a JSON array with data listed from 1-infinit and have data in the arrays. like this http://jsfiddle.net/Alfie/c4vtY/ – Anton Oct 07 '13 at 13:10

How to search JSON in jQuery

1 Answers1