Skip to content

Instantly share code, notes, and snippets.

@philsinatra

philsinatra/json parse

Created March 12, 2013 16:42
Show Gist options
  • Save philsinatra/5144522 to your computer and use it in GitHub Desktop.
Save philsinatra/5144522 to your computer and use it in GitHub Desktop.
Download ZIP
An example of loading and parsing a JSON file with javascript.
Raw
json parse
<!--
document.json file content =
[
{
"text" : "Video Button",
"type" : "video",
"link" : "http://google.com",
"script" : "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum dictum tortor, a tempor justo ultrices vel. Sed posuere mollis augue eget mattis. Nam sit amet elit eu tortor placerat posuere. Proin velit nunc, consectetur eu pharetra eu, posuere ut leo. Aliquam condimentum rutrum libero, non bibendum nisl condimentum eget. Proin et nulla at nibh pellentesque adipiscing. Maecenas dignissim pellentesque lorem, eu feugiat metus pellentesque nec. Sed pellentesque mi vitae tellus fermentum facilisis ac ut nunc. Nulla elementum condimentum quam, vel dignissim metus semper eget. Vestibulum non massa ipsum, ut pellentesque metus. Aenean non libero libero. Integer lobortis, mi vel cursus porta, lorem sapien porta sapien, sit amet dapibus augue enim a ligula. Ut vitae sem quam."
},
{
"text" : "Image Button",
"type" : "image",
"link" : "http://google.com",
"script" : ""
},
{
"text" : "Image Button",
"type" : "image",
"link" : "http://google.com",
"script" : "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vestibulum dictum tortor, a tempor justo ultrices vel. Sed posuere mollis augue eget mattis. Nam sit amet elit eu tortor placerat posuere. Proin velit nunc, consectetur eu pharetra eu, posuere ut leo. "
}
]
-->
<body>
<nav id="slidenav">
<ul></ul>
</nav>
<div id="script"></div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
function scriptAction (scriptInfo) {
$('#script').html(scriptInfo);
}
function clickAction (linkInfo) {
console.log ('clickAction = ' + linkInfo);
}
$.getJSON('document.json', { get_param: 'value' }, function(data) {
$.each(data, function(index, element) {
$('<li/>', {
class : element.type,
html : '<a href="javascript:scriptAction(\'' + data[index].script + '\'); clickAction(\'' + element.link + '\');">' + element.text + '</a>'
}).appendTo('#slidenav ul');
});
});
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment