The jQuery example uses data.items because the JSON data it fetches is an object with an items property. Load the sample URL in your browser and look at the data:
http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json
If you remove the jsonFlickrFeed() JSONP wrapper, then the data in skeletal form looks like:
{
"title": "Recent Uploads tagged cat",
"link": "http://www.flickr.com/photos/tags/cat/",
"description": "",
"modified": "2009-06-29T17:21:37Z",
"generator": "http://www.flickr.com/",
"items": [
{
"title": "Metzler & Ortloff #137X",
"link": "http://www.flickr.com/photos/31042172@N02/3671772469/",
"media": {
"m": "http://farm4.static.flickr.com/3613/3671772469_431f0c6df0_m.jpg"
},
"date_taken": "2009-06-29T10:21:37-08:00",
"description": "<p>...<\/p>",
"published": "2009-06-29T17:21:37Z",
"author": "nobody@flickr.com (metzlerortloff.cats)",
"author_id": "31042172@N02",
"tags": "cat ilmenau metzler ortloff"
},
{
// ...another item here, etc...
}
]
}
As you can see, here the outermost part of the JSON is an object enclosed by the {}. This object has an items property, which is the array of data for each of the Flickr images. So, if you fetch this JSON object into a variable named data, then data.items will be that items array.
If you paste the Flickr response into the JSON viewer that I mentioned in my other message, it will show you a nicely formatted tree structure for the data. Paste it into the Text tab and you will see an error message at the bottom because of the JSONP wrapper. Use the "Strip to {}" button at the top to automatically strip out that wrapper. Then click the Viewer tab to see the structure of the data.
-Mike
> From: expresso
>
> Mike thanks a lot. That is so weird. I got some ideas from
> http://docs.jquery.com/GetJSON and as you can see from the
> example it's using data.items.
>
> it's working now. I just wonder why the jQuery example is
> using data.items
>
> On Jun 29, 12:19 pm, "Michael Geary" <m...@mg.to> wrote:
> > That's right, your JSON is perfectly valid. You can test it at:
> >
> > www.jsonlint.org
> >
> > Here's the formatted output from that site, with the image
> tags elided
> > for clarity, and comments added showing how you'd access
> each part of
> > it directly in JavaScript:
> >
> > // Data
> > [
> > // Data[0]
> > {
> > // Data[0].ImageTag
> > "ImageTag": "..."
> > },
> > // Data[1]
> > {
> > // Data[1].ImageTag
> > "ImageTag": "..."
> > }
> > ]
> >
> > As you can see, what you have is an array of two elements. Each of
> > those elements is an object with a single property named
> ImageTag with
> > a string value.
> >
> > Now back to your code. This is where it goes wrong:
> >
> > $.each(Data.items, function(i, item) {...});
> >
> > "Data" here is the JSON data, and you're trying to get its "items"
> > property and use it as an array. But there is no "items" property -
> > Data itself is the array, so you'd use it directly:
> >
> > $.each(Data, function(i, item) {...});
> >
> > JSON that would work with your original code using Data.items would
> > look like this:
> >
> > // Data
> > {
> > // Data.items
> > "items": [
> > // Data.items[0]
> > {
> > // Data.items[0].ImageTag
> > "ImageTag": "..."
> > },
> > // Data.items[1]
> > {
> > // Data.items[1].ImageTag
> > "ImageTag": "..."
> > }
> > ]
> > }
> >
> > BTW, I suggest using variable names that begin with lower case. The
> > upper case first letter makes people think it's the name of
> a constructor.
> >
> > -Mike
> >
> > > From: expresso
> >
> > > some tells me that my original JSON is totally valid with
> the [ and
> > > ]
> >
> > > On Jun 29, 11:03 am, MorningZ <morni...@gmail.com> wrote:
> > > >http://en.wikipedia.org/wiki/JSON
> >
> > > > will show you what it should look like... notice the
> > > outside symbols
> > > > are { ... }, not [ .... ]
> >
> > > > again, you should look at this if you are working with .NET
> > > and JSON,
> > > > it really takes all this guess work from the equation:
> >
> > > >http://james.newtonking.com/pages/json-net.aspx
> >
> > > > On Jun 29, 12:01 pm, expresso <dschin...@gmail.com> wrote:
> >
> > > > > Ok, so what should it be wrapped in or how should I
> reformat this?
> >
> > > > > On Jun 29, 10:58 am, MorningZ <morni...@gmail.com> wrote:
> >
> > > > > > Wow, is posting the same thing every 3 mins to bump
> your topic
> > > > > > annoying....
> >
> > > > > > Anyways,
> >
> > > > > > your results wrapped in [ .... ] signifies an Array, not a
> > > > > > JSON object.... hence ".getJSON" has no idea what
> to do with
> > > > > > it
> >
> > > > > > On Jun 29, 11:53 am, expresso <dschin...@gmail.com> wrote:
> >
> > > > > > > So is this valid JSON that jQuery can parse? or
> do I need an
> > > > > > > initial level such as "Images":
> >
> > > > > > > [{"Images" :
> > > > > > > [{"ImageTag":"<img
> > > src="http://www.xxx.com/image/473.jpg"
> > > > > > > alt="">"},{"ImageTag":"<img
> > > > > > > src="http://www.xxx.com/image/4852.jpg"
> > > > > > > alt="">"} ]]
> >
> > > > > > > On Jun 29, 10:37 am, expresso <dschin...@gmail.com> wrote:
> >
> > > > > > > > Ok, figured out that data.items is undefined.
> Not sure why
> > > > > > > > because here's the json my url returns:
> >
> > > > > > > > [{"ImageTag":"<img
> > > src="http://www.xxx.com/image/473.jpg"
> > > > > > > > alt="">"},{"ImageTag":"<img
> >
> > > src="http://www.xxx.com/image/4852.jpg"alt=""&g
> > > > > > > > t;"}]
> >
> > > > > > > > On Jun 29, 10:33 am, expresso
> <dschin...@gmail.com> wrote:
> >
> > > > > > > > > I get the following error:
> >
> > > > > > > > > G is undefined
> > > > > > > > > init()()jquery-1....2.min.js (line 12)
> > > (?)()()Carousel.aspx
> > > > > > > > > (line 30) I()jquery-1....2.min.js (line 19)
> > > > > > > > > F()()jquery-1....2.min.js (line 19) [Break on this
> > > > > > > > > error] (function(){var
> l=this,g,y=l.jQuery,p=l.....each
> > > > > > > > > (function(){o.dequeue(this,E)})}});
> >
> > > > > > > > > in jquery-1.3.2.min.js
> >
> > > > > > > > > when I call this method of mine:
> >
> > > > > > > > >
> $.getJSON("http://localhost:59396/xxx/xxxHandler.ashx?
> > > > > > > > > action=xxxjson",
> > > > > > > > > function(Data) {
> > > > > > > > > $.each(Data.items, function(i, item) {
> > > > > > > > > alert('got here');
> > > > > > > > > carousel.add(i,
> > > > > > > > > mycarousel_decodeEntities(item.ImageTag));
> > > > > > > > > if (i == 3) return false;
> > > > > > > > > });
> > > > > > > > > });
> >
> > > > > > > > > I know I can get inside function(Data){ and that
> > > the error
> > > > > > > > > starts at $.each I believe
>
No comments:
Post a Comment