Skip to content

Instantly share code, notes, and snippets.

@maplpro

maplpro/gist:593725

Created September 23, 2010 14:47
Show Gist options
  • Save maplpro/593725 to your computer and use it in GitHub Desktop.
Save maplpro/593725 to your computer and use it in GitHub Desktop.
Download ZIP
jQuery sample
Raw
gistfile1.html
<html>
<head>
<script src="static/scripts/jquery/jquery-1.4.2.js" type="text/javascript" charset="utf-8"></script>
<script src="static/scripts/jquery/json2.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
$( function() {
function log(type, xhr) {
$( "#log" ).append('<div>' + type+ ' at '+new Date()+'</div>').append('<div>Status: ' + xhr.status + ' ' +
xhr.statusText+'</div>');
};
$('#log').ajaxError( function(event,xhr){
log( "Error", xhr );
});
$('#log').ajaxSuccess( function(event,xhr){
log( "Success", xhr );
});
$( ".month" ).click( function() {
var month = $(this).text();
$( "#result" ).fadeOut( "slow", function() {
$("#cloud").empty();
$( "#main" ).empty();
$.get( "/search?month=" + month,
function(data){
str_data = JSON.stringify( data )
if ( data.data.items ) {
$("#cloud").text( data.data.items.length )
$.each(data.data.items, function(i,item){
$("<div/>").html(item.object.content).appendTo("#main");
});
}
else
{
$("#cloud").text( "0" )
}
$( "#result" ).fadeIn( "slow" )
}
);
});
});
});
</script>
</head>
<body>
{% for month in months %}
<span>
<a class="month" href="#/{{month}}">{{month}}</a> |
</span>
{% endfor %}
<div id="result">
<div style="margin-top:10px;font-size:11px" >
Number of results:
<span style="margin-top:10px" id="cloud">
</span>
</div>
<div style="margin-top:10px" id="main">
</div>
<div style="margin-top:10px;font-size:90%" id="log"></div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment