Hi,
Can anyone tell me why no 'products' are being displayed from the JSON file?
This is my code:
products.html:
<!DOCTYPE html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<style>img{ height: 100px; float: left; }</style>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>
$.getJSON('products.json', function(data) {
$.each(data.products, function(i, item) {
$(".products").append(
"<table class='productTable'>"+
"<tr><td><img "+ "src='" +item.Source+"'/> </td></tr>"+
"<tr><td>Name "+ item.Name + "</td></tr>"+
"<tr><td>Album "+ item.Album + "</td></tr>"+
"<tr><td>Label "+ item.Label + "</td></tr>"+
"<tr><td>Genre "+ item.Genre + "</td></tr>"+
"<tr><td>Price "+ item.Price + "</td></tr>"+
"<tr><td>Tracks "+ item.Tracks + "</td></tr><br /><br />"+
"</table>"
);
console.log(products.item);
});
});
</script>
</head>
<body>
<div id="wrapper">
<header id="header">
<strong><table id="menu"><tr><td>Home</td><td>Contact</td><td>Login</td><td></td><td>Products</td></tr></table></strong>
</header>
<section id="middle">
<div id="container">
<div id="content">
<div class="products">
</div> </div><!-- #content-->
</div><!-- #container-->
<aside id="sideLeft">
<strong>Left Sidebar:</strong>
</aside><!-- #sideLeft -->
<aside id="sideRight">
<strong>Right Sidebar:</strong>
</aside><!-- #sideRight -->
</section><!-- #middle-->
</div><!-- #wrapper -->
<footer id="footer">
<strong>Footer: by Brian Livori</strong>
</footer><!-- #footer -->
</body>
</html>
JSON file:
{
"Products": [
{ "Name": "Pink Floyd",
"Album": "The Best Of Pink Floyd: A Foot In The Door",
"Label": "EMI UK",
"Tracks":"Hey You, See Emily Play, The Happiest Days Of Our Lives, Another Brick in The Wall (Part 2), Have a cigar, Wish You Where Here, Time, The Great Gig in the Sky, Money, Comfortably Numb, High Hopes, Learning to Fly, The Fletcher Memorial Home, Shine On You Crazy Diamond, Brain Damage, Eclipse" ,
"Price": "16.40",
"Genre": "Rock" ,
"Source": "http://images.coveralia.com/audio/p/Pink_Floyd-A_Foot_In_The_Door_The_Best_Of_Pink_Floyd-Frontal.jpg"
},
{
"Name": "Depeche Mode",
"Album": "A Question Of Time",
"Label": "Mute",
"Tracks":"A Question Of Time, Black Celebration, Something To Do, Stripped, More Than A Party, A Question Of Time(extended), Black Celebration" ,
"Price": "4.68" ,
"Genre": "Rock",
"Source": ""
},
{
"Name": "Burial",
"Album": "Street Halo/Kindred",
"Label": "Hyperdub Japan",
"Tracks":"Street Halo, NYC, Stolen Dog, Kindred, Loner, Ashtray Wasp" ,
"Price": "14.06",
"Genre": "Future Garage" ,
"Source": ""
},
{
"Name": "Aphex Twin",
"Album": "I Care Because You Do",
"Label": "1972 US",
"Tracks":"Acrid Avid Jam Shared, The Waxen Pith, Wax The Nip, Icct Hedral (edit), Ventolin (video version), Come On You Slags, Start As You Mean To Go On, Wet Tip Hen Ax, Mookid, Alberto Balsalm , Cow Cud Is A Twin, Next Heap With " ,
"Price": "21.10",
"Genre": "Electronica" ,
"Source": ""
},
{
"Name": "Daft Punk",
"Album": "Discovery",
"Label": "",
"Tracks":"One More Time, Aerodynamic, Digital Love, Harder Better Faster Stronger, Crescendolls , Nightvision, Superheroes, High Life ,Something About Us, Voyager ,Veridis Quo, Short Circuit, Face To Face," ,
"Price": "23.44" ,
"Genre": "Nu-Disco" ,
"Source": ""
},
{
"Name": "Jean Michelle Jarre",
"Album": "Oxegene 2010",
"Label": "Oxegene",
"Tracks":"Oxegene 2010" ,
"Price": "8.20",
"Genre": "Ambient" ,
"Source": ""
},
{
"Name": "Joy Division",
"Album": "In The Studio With Martin Hannett",
"Label": "Interstate",
"Tracks":"Digital Full Track, Noise Drums Sine Warm-up, Square Heat Ambience Workout, Glass - Breakout Full Track, Synth Ambience Warm-up, Ambience Atmosphere Warm-up, Atmosphere Setting Up, Drums & Bass Full Atmosphere Warm-up Silence, Atmosphere Full Track Metronome Intro - Hannett Intro Question Etc, Metronome Initial Adjustments #1, Metronome Initial Adjustments #2 Industrial Build Up Etc, Dead Souls Sound Check Drums Recognition Check, Dead Souls + Metronome Intro Adjustment Full Track Etc, Cups Smash 'Synth Filters Sweeps' Take #1, Hannett Interview Something Fishy, Ice Age Bass Ambience Warm-up, Full Track Ice Age, Bass Intro Noise Ambience, Clapping Drums Clapping Prog N4 Complete Full Track + Noise, Full Track N4 Programming + Noises, Full Eternal Track, More N4 Drum Programming Bass Guitar, N4 Industrial, N4 More Warm Up, Digital Ambience Warmth Rooms Warm-up - Shakin Speaker Dust Off" ,
"Price": "22.27",
"Genre": "Rock" ,
"Source": ""
},
{
"Name": "Anthony Rother",
"Album": "Mother",
"Label": "Datapunk Germany",
"Tracks":"Mother, Cinema" ,
"Price": "10.54",
"Genre": "Electro",
"Source": ""
},
{
"Name": "Gorillaz",
"Album": "Plastic Beach",
"Label": "EMI UK",
"Tracks":"Orchestral Intro, Welcome To The World Of The Plastic Beach, White Flag, Rhinestone Eyes, Stylo, Superfast Jellyfish, Empire Ants, Glitter Freeze, Some Kind Of Nature, On Melancholy Hill, Broken, Sweepstakes , Plastic Beach , To Binge , Cloud Of Unknowing , Pirate Jet " ,
"Price": "7.02" ,
"Genre": "Hip Hop",
"Source": ""
},
{
"Name": "Eminem",
"Album": "Recovery",
"Label": "",
"Tracks":"Cold Wind Blows, Talkin' 2 Myself (feat Kobe), On Fire , Won't Back Down (feat P!nk) ,WTP , Going Through Changes , Not Afraid , Seduction, No Love (feat Lil Wayne) , Space Bound , Cinderella Man , To Life, So Bad , Almost Famous , Love The Way You Lie (feat Rihanna) , You're Never Over, rack 17" ,
"Price": "19.92",
"Genre": "Hip Hop" ,
"Source": ""
}
]
}
What I'm trying to do is display the contents of the JSON file into a table.
Can anyone tell me whats wrong ?
