CURRENT PROJECTS
loading
CATEGORIES AND POSTS
loading
overset
DEVELOPMENT LOG FOR JIM PALMER
Posted 08/30/2008 in jquery


jTPS is a datatable jQuery plugin that offers pagination, animated scrolling through pages and intelligent natural sorting capability. The development version is currently 15KB.

DEMO
loading demo..

ASSETS As they currently reside on Google Code CHANGELOG BASIC USAGE
You have a simple table you wish to bind jTPS to (different than demo above and simpler):
<html>
<head>
	<script language="JavaScript" type="text/javascript" src="jquery.js"></script>
	<script language="JavaScript" type="text/javascript" src="jTPS.js"></script>
	<link rel="stylesheet" type="text/css" href="jTPS.css">
	<script type="text/javascript">
		$(function () { 
			$('#demoTable').jTPS( {perPages:[5]} );
		});
	</script>
</head>
<body>
<table id="demoTable">
	<thead>
		<tr>
			<th sort="decrip">Description</th>
			<th sort="price">Price</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>Product 1.09</td>
			<td>$1002.99</td>
		</tr>
		<tr>
			<td>Product 1.01</td>
			<td>$432.77</td>
		</tr>
		<tr>
			<td>Product 1.05</td>
			<td>$432.76</td>
		</tr>
		<tr>
			<td>Product 1.03</td>
			<td>$102.01</td>
		</tr>
		<tr>
			<td>Product 1.06</td>
			<td>$100.99</td>
		</tr>
		<tr>
			<td>Product 1.00</td>
			<td>$10202.00</td>
		</tr>
	</tbody>
	<tfoot class="nav">
		<tr>
			<td colspan="2">
				<div class="pagination"></div>
				<div class="paginationTitle">Page</div>
				<div class="selectPerPage"></div>
				<div class="status"></div>
			</td>
		</tr>
	</tfoot>
</table>
</body>
</html>
This will load the jTPS library after the jQuery core and then apply jTPS to the demoTable via the jQuery document.ready.

NOTES
comments
loading
new comment
NAME
EMAIL ME ON UPDATES
EMAIL (hidden)
URL
MESSAGE TAGS ALLOWED: <code> <a> <pre class="code [tab4|tabX|inline|bash]"> <br>
PREVIEW COMMENT
TURING TEST
gravatar