<?xml version="1.0" encoding="UTF-8" ?>
<dt-example table-type="html" order="2">

<css lib="datatables" />
<js lib="jquery" />
<js lib="datatables" />

<title>DataTables events</title>
<js><![CDATA[

$(document).ready(function() {
	var eventFired = function ( type ) {
		var n = $('#demo_info')[0];
		n.innerHTML += '<div>'+type+' event - '+new Date().getTime()+'</div>';
		n.scrollTop = n.scrollHeight;		
	}

	$('#example')
		.on( 'order.dt',  function () { eventFired( 'Order' ); } )
		.on( 'search.dt', function () { eventFired( 'Search' ); } )
		.on( 'page.dt',   function () { eventFired( 'Page' ); } )
		.DataTable();
} );

]]></js>

<info><![CDATA[

DataTables fires a number of custom events which you can bind to in the standard jQuery fashion (although note that the namespace `dt` _must_ be used), allowing your code to perform custom actions when these events occur.

All custom events fired by DataTables are fired with the namespace `dt` in order to prevent conflicts arising with other jQuery plug-ins which also fire events. The DataTables `dt-api on()` method can be used like the jQuery `on()` method, but will automatically append the `dt` namespace if required.

This example shows the use of the `dt-event order`, `dt-event search` and `dt-event page` events by adding a notification that the event fired to an element on the page to show that they have indeed fired.

]]></info>

<demo-html>
	<div id="demo_info" class="box"> </div>
</demo-html>

</dt-example>
