Problem sa ucitavanjem podataka iz .json

[ Jovana_87_Bg @ 31.08.2012. 22:05 ] @

Imam problem da na HTML strani ocitam podatke iz .json. Pronasla sam neki kod na internetu ali ne znam zbog cega ne radi, tj. ne znam gde gresim. U koliko neko zna u cemu je problem bilo bi lepo da mi pomogne.

Postavicu ovde kod a uploadovacu i .html fajl sa javascriptom i .json fajl.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function() {

   var div = $('.profile');
   var ul = $('ul');
   var people = [];

   $.getJSON('people.json', function(data) {
       $.each(data.person, function(i, f) {
           people.push([f.firstName, f.lastName, f.job, f.image]);
           ul.append('<li><a href="#' + i + '">' + f.firstName + '</a></li>')
       });
       $('a').on('click', addContent);
   });

});

$(function() {

   var div = $('.profile');
   var ul = $('ul');
   var people = [];

   $.getJSON('people.json', function(data) {
       $.each(data.person, function(i, f) {
           people.push([f.firstName, f.lastName, f.job, f.image]);
           ul.append('<li><a href="#' + i + '">' + f.firstName + '</a></li>')
       });
       $('a').on('click', addContent);
   });

   function addContent(e) {
       e.preventDefault();
       var hash = this.hash.replace('#','');
       div.html('');
       div.append('<img src="images/' + people[hash][3] + '">');
       div.append('<p><b>Name:</b> ' + people[hash][0] + ' ' + people[hash][1] + '</p>');
       div.append('<p><b>Job:</b> ' + people[hash][2] + '</p>');
   }

});
</script>
</head>
<body>
<div class="wrapper">
   <ul></ul>
   <div class="profile"></div>

</div>

</body>
</html>

[ 357_97 @ 21.09.2012. 08:14 ] @

Ovo radi:

Code (javascript):

$(document).ready(function() {

   var div = $('.profile');

   var ul = $('ul');

   var people = [];

   $.getJSON('people.json', function(data) {

       $.each(data.person, function(i, f) {

           people.push([f.firstName, f.lastName, f.job, f.image]);

           ul.append('<li><a href="#' + i + '">' + f.firstName + '</a></li>')

       });

       $('a').on('click', addContent);

   });

   function addContent(e) {

       e.preventDefault();

       var hash = this.hash.replace('#','');

       div.html('');

       div.append('<img src="images/' + people[hash][3] + '">');

       div.append('<p><b>Name:</b> ' + people[hash][0] + ' ' + people[hash][1] + '</p>');

       div.append('<p><b>Job:</b> ' + people[hash][2] + '</p>');

   }

});

Instaliraj firebug add-on za Firefox bice ti mnogo lakse da pronadjes greske prilikom kodiranja. Za tvoj kod je 'bacao' gresku addContent is not defined!