<div class="layout-app">
	<div class="row">
		<div class="col-sm-12">
			<div class="col-separator col-separator-first box col-unscrollable">
				<div class="tab_generic" style="padding: 10px;">
					<h4>Customers Data</h4>
					<div class="row" style="margin: 5px 0;">
						<div class="col-sm-3 col-xs-6">
							<div class="input-group">
								<input type="text" class="form-control" placeholder="Search for...">
								<span class="input-group-btn"><button class="btn btn-default" type="button"><i class="fa fa-search"></i></button></span>
							</div>
						</div>
						<div class="col-sm-3 col-xs-6 pull-right">
							<p class="text-right"><a href="#" onclick="previousPage();return false;"><i class="fa fa-chevron-circle-left"></i> Previous Page</a> | <a href="#" onclick="nextPage();return false;">Next Page <i class="fa fa-chevron-circle-right"></i></a></p>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-12" id="outputData"></div>
						<p class="text-right"><a href="#" onclick="previousPage();return false;"><i class="fa fa-chevron-circle-left"></i> Previous Page</a> | <a href="#" onclick="nextPage();return false;">Next Page <i class="fa fa-chevron-circle-right"></i></a></p>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script>
var page = 1;
doAjax('data/load?page='+page,'','outputData','','singlethis','GET');
function nextPage(){ page++; doAjax('data/load?page='+page,'','outputData','','singlethis','GET'); }
function previousPage(){ page--; doAjax('data/load?page='+page,'','outputData','','singlethis','GET'); }
</script>