jquery.loading.js Example

The aim of this is to replace an item in the body with a Loading indicator while you fetch/update the contents

Basic Example

Click Below to Load Content

<div id='external_content'>Click Below to Load Content</div>
<button id='refresh_content'>Refresh Content</button>
<script>
	$('#refresh_content').on('click', function(){
		$('#external_content').loading();
		$.ajax('load/something', {
			complete: function(result){
				$('#external_content').html(result.html)
			}
		});
	});
</script>

Custom Text Example

Click Below to Load Content

<div id='external_content'>Click Below to Load Content</div>
<button id='refresh_content'>Refresh Content</button>
<script>
	$('#refresh_content').on('click', function(){
		$('#external_content').loading({ text: "Updating Data..." });
		$.ajax('load/something', {
			complete: function(result){
				$('#external_content').html(result.html)
			}
		});
	});
</script>