liferay#1268 - update demo adding the new handlers

marco-leo · Oct 29, 2018 · f7649de · f7649de
1 parent 5879c2a
commit f7649de
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 7 deletions.
diff --git a/packages/clay-pagination-bar/demos/index.html b/packages/clay-pagination-bar/demos/index.html
@@ -34,33 +34,45 @@ <h1>ClayPaginationBar</h1>
 	<script type="text/javascript">
 		const spritemap = '../../../node_modules/clay-css/lib/images/icons/icons.svg';
 
-		new metal.ClayPaginationBar({
-			baseHref: 'container',
+		var clayPaginationBar = new metal.ClayPaginationBar({
+			baseHref: '#container',
 			currentPage: 2,
 			entries: [
 				{
-					href: 'container',
+					href: '#container',
 					label: 5,
+					itemsPerPage: 5,
 				},
 				{
 					active: true,
-					href: 'container',
+					href: '#container',
 					label: 10,
+					itemsPerPage: 10,
 				},
 				{
-					href: 'container',
+					href: '#container',
 					label: 15,
+					itemsPerPage: 15
 				},
 				{
-					href: 'container',
+					href: '#container',
 					label: 20,
+					itemsPerPage: 20
 				},
 			],
 			selectedEntry: 1,
 			spritemap: spritemap,
 			totalEntries: 21,
 		}, '#container1');
 
+		clayPaginationBar.on('pageClicked', function(e) {
+			console.log("Selected page: " + e.data.page);
+		});
+
+		clayPaginationBar.on('itemsPerPageClicked', function(e) {
+			console.log("Items per page: " + e.data.item.itemsPerPage);
+		});
+
 	</script>
 </body>
 </html>
diff --git a/packages/clay-pagination/demos/index.html b/packages/clay-pagination/demos/index.html
@@ -105,7 +105,10 @@ <h2>10 pages</h2>
 					currentPage: currentPage,
 					spritemap: spritemap,
 					totalPages: totalPages,
-				}, '#container' + totalPages);
+				}, '#container' + totalPages)
+				.on('pageClicked', function(e) {
+					console.log("Selected page: " + e.data.page);
+				});
 			}
 		}
 	</script>