Question

I’m developing a Phonegap app using jQuery mobile, for which I’m using a local JSON file to store a bunch of stuff.

I’m wanting to populate pages on the fly with various objects and values from the JSON files, the layout of which is something along the lines of…

{"root" :[    
{"thingy" : "Bobby",
      "bits" : {
        "stuff" : {
          "One" : 1,
          "Two" : "Too"
        }
      },
      "bobs" : {
        "nicknackOne" : {
          "Three" : 3,
          "Four" : "Fore"
        },
        "nicknackTwo" : {
          "Five" : 5,
          "Six" : "Sicks"
        }
      }
    },
{"thingy" : "Majig",
      "bits" : {
        "stuff" : {
          "Seven" : "Ceven",
          "Eight" : "Ate"
        }
      },
      "bobs" : {
        "nicknackOne" : {
          "Nine" : 9,
          "Ten" : "Tenne"
        },
        "nicknackTwo" : {
          "Eleven" : 11,
          "Twelve" : "Tw' Elve"
        }
      }
    }
]}

One page creates a list of links with “Bobby” and “Majig” from the ‘thingy’s. The value of the ‘thingy’ is saved as a global variable that I want to use on the new page to show all the child objects attached.

So I’m struggling to take the value – “Bobby” and show everything connected.

What I’d like to do is something like this…

  $.getJSON(url, {request just"Bobb"} function(data) {
//Inject the values in 'data' as HTML
});

Please bear with me, I’m very new and still trying to get to grips with jQuery. All help greatly appreciated.

Thanks in advance.

Answer 1

As far as I know, you can’t request specific parts of a static JSON file without something server-side to process that type of request. You’ll need to pull the entire file and then extract the part you want.

$.getJSON(url, function(data) {
  for (var i=0;i<data.root.length;i++){
    if (data.root[i].thingy == "Bobby"){
      // do stuff
    }
  }
});