Prototype AJAX-JSON-DOM Manipulation first test

dummyResponse.json

[ { "fields" : { "created" : "2011-02-07 13:41:37",
        "modified" : "2011-02-07 13:41:37",
        "tags" : [ 1,
            2
          ],
        "text" : "Ultimo contenido",
        "title" : "Ultimo contenido"
      },
    "model" : "blog.content",
    "pk" : 5
  },
  { "fields" : { "created" : "2011-02-07 01:01:31",
        "modified" : "2011-02-07 01:01:31",
        "tags" : [ 1,
            2
          ],
        "text" : "Prueba 07 febrero",
        "title" : "Prueba 07 febrero"
      },
    "model" : "blog.content",
    "pk" : 4
  },
  { "fields" : { "created" : "2011-02-06 13:48:29",
        "modified" : "2011-02-06 15:22:17",
        "tags" : [ 1,
            2
          ],
        "text" : "<p>Otro contenido de prueba</p>\r\n<p>Lorem ipsum duo te atqui mazim. Sed cu modo quot nonummy, mnesarchum consetetur no ius. Nulla ceteros platonem mea eu, ne vim solum insolens, eos ut ipsum euripidis. Ut nec singulis voluptatibus. Sumo utinam commodo usu ut. Nisl doctus expetenda id his.\r\n  </p>\r\n  <p>\r\nTe sea modo dolorem accommodare. Te vix elitr suscipiantur, et sit lorem omittam, id duo magna meliore omittam. Ei qui decore soleat scriptorem, te saepe impetus pertinax sea. Nec ea amet suas, qui verear philosophia ad.\r\n  </p>\r\n  <p>\r\nEst cu appareat vituperata scripserit, wisi nominati mea cu, sit ipsum nostrum facilisis in. Puto corpora scaevola eam ut, ut sint nusquam has. His te postulant referrentur. Cu mel mnesarchum scribentur.\r\n  </p>\r\n  <p>\r\nEu nonumy invidunt sapientem vel, sed forensibus consequuntur id. Sea cu inani primis persius. Aliquyam adipisci in duo, vix ex ornatus neglegentur. Vivendum delicatissimi eum ea. Ex vivendum contentiones consectetuer quo. Nec noster facilis reformidans ne.\r\n  </p>\r\n  <p>\r\nEu doctus delenit vis, at ignota doctus eos, sanctus accumsan consectetuer te sea. Cum consul soleat definitiones ea. Mea eleifend antiopam salutatus ne, latine delicatissimi no ius. Ex per reque corpora recteque, alia affert impetus nec eu. Vim id hinc explicari aliquando, nec erat vidit delenit in, vidit zzril dolore ex est.\r\n  </p>\r\n  <p>\r\nStet aliquid sed an. Consetetur necessitatibus mel ex. Vix veniam homero ne, vix principes moderatius eu. Eu atqui debet explicari mei, ea nostrud debitis graecis est, mea doctus imperdiet ne. Vix ea mandamus intellegam, usu scaevola dissentias ex.\r\n  </p>\r\n  <p>\r\nEa eum enim nemore euismod. At agam verterem vim, ut est nullam mollis aliquid, ex sed omnium corrumpit consulatu. Ius mazim denique te, sea cibo timeam expetendis at, sale quando gubergren sea ad. Vel cu iriure ceteros, adhuc postulant pertinacia nam id. Utroque recusabo an pri, sea ut dictas sententiae, his at nulla nihil mandamus.\r\n  </p>\r\n  <p>\r\nSaepe viderer molestie pri ne, dicunt evertitur pro no. Ea sumo reprimique pri. Stet deleniti te nec, cetero elaboraret assueverit usu an, ignota nusquam ut mel. Qui autem populo eirmod eu. In odio alienum molestie cum, ex has wisi exerci. Sed modo omnis zzril at.\r\n  </p>\r\n  <p>\r\nVel enim ignota delicatissimi ut, wisi senserit hendrerit ne mel. Sumo quaestio corrumpit nec et, eos stet sadipscing eu, ei agam natum omnesque eos. Qui veri minimum id, eam in falli saepe persecuti. Prodesset dissentiet vim an, voluptua delicata eos in. Vero dicta tamquam nec id, eos oporteat accommodare in, est soleat blandit et.\r\n  </p>\r\n  <p>\r\nIus everti similique consetetur te. Eu sed sumo propriae, ex congue ceteros disputando ius. An nam augue placerat. Cum et atomorum indoctum. Vel cu aliquid patrioque, vis nullam fuisset at, in nibh numquam legendos cum.\r\n</p>",
        "title" : "Otro contenido de prueba"
      },
    "model" : "blog.content",
    "pk" : 3
  },
  { "fields" : { "created" : "2011-02-06 11:55:11",
        "modified" : "2011-02-06 15:22:32",
        "tags" : [ 1 ],
        "text" : "<p>Otro post</p>\r\n<p>Lorem ipsum duo te atqui mazim. Sed cu modo quot nonummy, mnesarchum consetetur no ius. Nulla ceteros platonem mea eu, ne vim solum insolens, eos ut ipsum euripidis. Ut nec singulis voluptatibus. Sumo utinam commodo usu ut. Nisl doctus expetenda id his.\r\n  </p>\r\n  <p>\r\nTe sea modo dolorem accommodare. Te vix elitr suscipiantur, et sit lorem omittam, id duo magna meliore omittam. Ei qui decore soleat scriptorem, te saepe impetus pertinax sea. Nec ea amet suas, qui verear philosophia ad.\r\n  </p>\r\n  <p>\r\nEst cu appareat vituperata scripserit, wisi nominati mea cu, sit ipsum nostrum facilisis in. Puto corpora scaevola eam ut, ut sint nusquam has. His te postulant referrentur. Cu mel mnesarchum scribentur.\r\n  </p>\r\n  <p>\r\nEu nonumy invidunt sapientem vel, sed forensibus consequuntur id. Sea cu inani primis persius. Aliquyam adipisci in duo, vix ex ornatus neglegentur. Vivendum delicatissimi eum ea. Ex vivendum contentiones consectetuer quo. Nec noster facilis reformidans ne.\r\n  </p>\r\n  <p>\r\nEu doctus delenit vis, at ignota doctus eos, sanctus accumsan consectetuer te sea. Cum consul soleat definitiones ea. Mea eleifend antiopam salutatus ne, latine delicatissimi no ius. Ex per reque corpora recteque, alia affert impetus nec eu. Vim id hinc explicari aliquando, nec erat vidit delenit in, vidit zzril dolore ex est.\r\n  </p>\r\n  <p>\r\nStet aliquid sed an. Consetetur necessitatibus mel ex. Vix veniam homero ne, vix principes moderatius eu. Eu atqui debet explicari mei, ea nostrud debitis graecis est, mea doctus imperdiet ne. Vix ea mandamus intellegam, usu scaevola dissentias ex.\r\n  </p>\r\n  <p>\r\nEa eum enim nemore euismod. At agam verterem vim, ut est nullam mollis aliquid, ex sed omnium corrumpit consulatu. Ius mazim denique te, sea cibo timeam expetendis at, sale quando gubergren sea ad. Vel cu iriure ceteros, adhuc postulant pertinacia nam id. Utroque recusabo an pri, sea ut dictas sententiae, his at nulla nihil mandamus.\r\n  </p>\r\n  <p>\r\nSaepe viderer molestie pri ne, dicunt evertitur pro no. Ea sumo reprimique pri. Stet deleniti te nec, cetero elaboraret assueverit usu an, ignota nusquam ut mel. Qui autem populo eirmod eu. In odio alienum molestie cum, ex has wisi exerci. Sed modo omnis zzril at.\r\n  </p>\r\n  <p>\r\nVel enim ignota delicatissimi ut, wisi senserit hendrerit ne mel. Sumo quaestio corrumpit nec et, eos stet sadipscing eu, ei agam natum omnesque eos. Qui veri minimum id, eam in falli saepe persecuti. Prodesset dissentiet vim an, voluptua delicata eos in. Vero dicta tamquam nec id, eos oporteat accommodare in, est soleat blandit et.\r\n  </p>\r\n  <p>\r\nIus everti similique consetetur te. Eu sed sumo propriae, ex congue ceteros disputando ius. An nam augue placerat. Cum et atomorum indoctum. Vel cu aliquid patrioque, vis nullam fuisset at, in nibh numquam legendos cum.\r\n</p>",
        "title" : "Otro post"
      },
    "model" : "blog.content",
    "pk" : 2
  },
  { "fields" : { "created" : "2011-02-06 11:54:43",
        "modified" : "2011-02-06 15:22:49",
        "tags" : [ 1 ],
        "text" : "<p>Bienvenidos</p>\r\n<p>Lorem ipsum duo te atqui mazim. Sed cu modo quot nonummy, mnesarchum consetetur no ius. Nulla ceteros platonem mea eu, ne vim solum insolens, eos ut ipsum euripidis. Ut nec singulis voluptatibus. Sumo utinam commodo usu ut. Nisl doctus expetenda id his.\r\n  </p>\r\n  <p>\r\nTe sea modo dolorem accommodare. Te vix elitr suscipiantur, et sit lorem omittam, id duo magna meliore omittam. Ei qui decore soleat scriptorem, te saepe impetus pertinax sea. Nec ea amet suas, qui verear philosophia ad.\r\n  </p>\r\n  <p>\r\nEst cu appareat vituperata scripserit, wisi nominati mea cu, sit ipsum nostrum facilisis in. Puto corpora scaevola eam ut, ut sint nusquam has. His te postulant referrentur. Cu mel mnesarchum scribentur.\r\n  </p>\r\n  <p>\r\nEu nonumy invidunt sapientem vel, sed forensibus consequuntur id. Sea cu inani primis persius. Aliquyam adipisci in duo, vix ex ornatus neglegentur. Vivendum delicatissimi eum ea. Ex vivendum contentiones consectetuer quo. Nec noster facilis reformidans ne.\r\n  </p>\r\n  <p>\r\nEu doctus delenit vis, at ignota doctus eos, sanctus accumsan consectetuer te sea. Cum consul soleat definitiones ea. Mea eleifend antiopam salutatus ne, latine delicatissimi no ius. Ex per reque corpora recteque, alia affert impetus nec eu. Vim id hinc explicari aliquando, nec erat vidit delenit in, vidit zzril dolore ex est.\r\n  </p>\r\n  <p>\r\nStet aliquid sed an. Consetetur necessitatibus mel ex. Vix veniam homero ne, vix principes moderatius eu. Eu atqui debet explicari mei, ea nostrud debitis graecis est, mea doctus imperdiet ne. Vix ea mandamus intellegam, usu scaevola dissentias ex.\r\n  </p>\r\n  <p>\r\nEa eum enim nemore euismod. At agam verterem vim, ut est nullam mollis aliquid, ex sed omnium corrumpit consulatu. Ius mazim denique te, sea cibo timeam expetendis at, sale quando gubergren sea ad. Vel cu iriure ceteros, adhuc postulant pertinacia nam id. Utroque recusabo an pri, sea ut dictas sententiae, his at nulla nihil mandamus.\r\n  </p>\r\n  <p>\r\nSaepe viderer molestie pri ne, dicunt evertitur pro no. Ea sumo reprimique pri. Stet deleniti te nec, cetero elaboraret assueverit usu an, ignota nusquam ut mel. Qui autem populo eirmod eu. In odio alienum molestie cum, ex has wisi exerci. Sed modo omnis zzril at.\r\n  </p>\r\n  <p>\r\nVel enim ignota delicatissimi ut, wisi senserit hendrerit ne mel. Sumo quaestio corrumpit nec et, eos stet sadipscing eu, ei agam natum omnesque eos. Qui veri minimum id, eam in falli saepe persecuti. Prodesset dissentiet vim an, voluptua delicata eos in. Vero dicta tamquam nec id, eos oporteat accommodare in, est soleat blandit et.\r\n  </p>\r\n  <p>\r\nIus everti similique consetetur te. Eu sed sumo propriae, ex congue ceteros disputando ius. An nam augue placerat. Cum et atomorum indoctum. Vel cu aliquid patrioque, vis nullam fuisset at, in nibh numquam legendos cum.\r\n</p>",
        "title" : "Bienvenidos"
      },
    "model" : "blog.content",
    "pk" : 1
  }
]

test_prototype_ajax_json.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<title>Prototype sample</title>
	<script src="lib/prototype/prototype.js" type="text/javascript"></script>
</head>
<body>
	<div id="latest-posts">
		Loading latests-posts
	</div>
</body>
</html>
<script type="text/javascript" language="JavaScript">
	
function updateLatestPosts(jsonPostList) {
	
	$('latest-posts').update('updating');
	
	posts = new Element('ul');
	eval(jsonPostList).each(function(item) {
		
		post = new Element('li');
		post.update(item.fields.title);
		posts.insert(post);
	});
	$('latest-posts').update(posts);
}

function retrieveLatestPosts() {

	new Ajax.Request('./dummyResponse.json', {
		method:'get',
		onSuccess: function(transport) {
			
			updateLatestPosts(transport.responseText);
		},
		onFailure: function() {
			alert('Something went wrong...');
		}
	});	
	$('latest-posts').update'retrieving latest posts');
}

Event.observer(window, 'load', retrieveLatestPosts());
</script>