$(document).ready(function() {
		var list = new Array();

		$('table thead tr th').each(function(index) {
		 list.push($(this).text());
  		});

		var current_pg = $('#current_pg');
		var table = $('#datatable');
		var ipp;
		var page;

		$("#page").change(function () {
			ipp = $('#ipp').val();
			page = $('#page').val();
		    getData(ipp,page,table);
		});

		$("#ipp").change(function () {
			ipp = $('#ipp').val();
			page = $('#page').val();
			getData(ipp,page,table);
		});

		$('a.paginate').live('click', function(e) {
			e.preventDefault();
  			var ipp = $('#ipp').val();
			var page = $(this).attr("value");
			var prvnext = parseInt($("#page").val());

			if(page == "next") {
				page = prvnext+1;
				$("#page").change().val(page);
				getData(ipp,page,table);
			} else if( page == "previous")  {
				page = prvnext-1;
				$("#page").change().val(page);
				getData(ipp,page,table);
			} else if( page == "All") {
				page = 1;
				ipp = $('#ipp').val("All");
				$("#page").change().val(page);
				getData(ipp,page,table);
			} else {
				$("#page").change().val(page);
				getData(ipp,page,table);
			}
			getData(ipp,page,table);
	});

function getData(ipp,page,table) {
		$.get('ajax.php',{ipp:ipp,page:page,action:'data'}, function(data){
		var json = jQuery.parseJSON(data);
			current_pg.html(page);
			table.html('');

			$(function () {

            var content = '';
            content += '<table class="datatable">';
			content += '<thead>';
            content += '<tr>';
			$.each(list, function(i, v) { content += '<th>'+ v + '</th>'; });
			content += '<tr>';
			content += '</thead>';
			content += '<tbody>';
            for (var i = 0; i < json.length; i++) {
                content += '<tr>';
                content += '<td>' + json[i].ID + '</td>';
				content += '<td>' + json[i].Name + '</td>';
				content += '<td>' + json[i].CountryCode + '</td>';
				content += '<td>' + json[i].District + '</td>';
				content += '<td>' + json[i].Population + '</td>';
                content += '</tr>';
            }
			content += '</tbody>';
            content += '</table>';
            table.html(content);
        })
	});
	$.get('ajax.php',{ipp:ipp,page:page,action:'pages'}, function(data){ $(".pages").html(data); });
};
});