jquery json help

Soldato
Joined
12 May 2007
Posts
3,896
Location
Bristol
I've created a script which grabs data from an xml file and uses it to animate some objects on a page. Unfortunately, I've just been told that I need to use jSON instead of XML.
Now, I've created a new script but it's just not working and I have no idea why. Anyone have any clue?


Working XML
http://www.tripnologist.com/example/xml/

Not working jSON
http://www.tripnologist.com/example/json/

Files for both if someone is feeling kind and wants to give me a hand.
http://www.tripnologist.com/example/example.zip
 
Try properly quoting the JSON first:

PHP:
{
    "week":{
        "mon":{
            "positiontop":"120",
            "opacity":"0.1",
            "duration":"2500",
            "size":"47px",
            "background":"green"
        },
        "tue":{
            "positiontop":"80",
            "opacity":"0.2",
            "duration":"2500",
            "size":"50px",
            "background":"blue"
        },
        "wed":{
            "positiontop":"110",
            "opacity":"0.3",
            "duration":"2500",
            "size":"20px",
            "background":"purple"
        },
        "thu":{
            "positiontop":"80",
            "opacity":"0.4",
            "duration":"2500",
            "size":"60px",
            "background":"black"
        },
        "fri":{
            "positiontop":"40",
            "opacity":"0.5",
            "duration":"2500",
            "size":"35px",
            "background":"red"
        },
        "sat":{
            "positiontop":"120",
            "opacity":"0.7",
            "duration":"2500",
            "size":"40",
            "background":"yellow"
        },
        "sun":{
            "positiontop":"60",
            "opacity":"0.8",
            "duration":"2500",
            "size":"63px",
            "background":"red"
        }
    }
}
(I quoted everything, though you might not need to do it all)

http://www.jsonlint.com/
 
I have it working now. I just had the js wrong.

Code:
$(document).ready(function(){
        $.ajax({
                type: "GET",
                url: "data.txt",
                dataType: "json",
                success: function(data) {
                        for (var i in data.week) {
                                var day = data.week[i];
                                var bc = $("." + i +" .bubbleContainer");
                                bc.animate({"top": day.positiontop, "opacity": day.opacity, "width": day.size, "backgroundColor": day.background }, day.duration );
                                bc.children("img").animate({ "backgroundColor": day.background }, day.duration );
                        }
                }
        });
});
 
Back
Top Bottom