|
@@ -1,7 +1,15 @@
|
|
|
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
|
|
|
pageEncoding="UTF-8"%>
|
|
|
-<%@ taglib prefix="s" uri="/struts-tags"%><!DOCTYPE html>
|
|
|
+<%@ taglib prefix="tag" tagdir="/WEB-INF/tags" %>
|
|
|
+<%@ taglib prefix="s" uri="/struts-tags"%>
|
|
|
+<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
|
|
+<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
|
|
|
|
|
+<c:set var="req" value="${pageContext.request}" />
|
|
|
+<c:set var="url">${req.requestURL}</c:set>
|
|
|
+<c:set var="base" value="${fn:substring(url, 0, fn:length(url) - fn:length(req.requestURI))}${req.contextPath}/" />
|
|
|
+
|
|
|
+<!DOCTYPE html>
|
|
|
<html>
|
|
|
|
|
|
<head>
|
|
@@ -96,6 +104,9 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</footer>
|
|
|
+
|
|
|
+ <!-- Loader -->
|
|
|
+ <tag:loader name="loader" />
|
|
|
|
|
|
<!-- Script -->
|
|
|
<script type="text/javascript" src="js/jquery.min.js"></script>
|
|
@@ -103,80 +114,69 @@
|
|
|
<script type="text/javascript" src="js/script.js"></script>
|
|
|
<!-- Script pour cette page-->
|
|
|
<script type="text/javascript">
|
|
|
- var data = [
|
|
|
- [
|
|
|
- {
|
|
|
- 'nom': 'Mollin',
|
|
|
- 'prenom': 'Jean',
|
|
|
- 'ville': 'Lens',
|
|
|
- 'email': 'jmollin@email.fr'
|
|
|
- },
|
|
|
- {
|
|
|
- 'nom': 'Mollin',
|
|
|
- 'prenom': 'Emillie',
|
|
|
- 'ville': 'Lens',
|
|
|
- 'email': 'emollin@email.fr'
|
|
|
- },
|
|
|
- {
|
|
|
- 'nom': 'Reuli',
|
|
|
- 'prenom': 'Robert',
|
|
|
- 'ville': 'Lens',
|
|
|
- 'email': 'robert.reuli@mail.com'
|
|
|
- }
|
|
|
- ],
|
|
|
- [
|
|
|
- {
|
|
|
- 'nom': 'Dufour',
|
|
|
- 'prenom': 'George',
|
|
|
- 'ville': 'Lens',
|
|
|
- 'email': 'dufour-george@email.fr'
|
|
|
- },
|
|
|
- {
|
|
|
- 'nom': 'Ellestou',
|
|
|
- 'prenom': 'Jeanne',
|
|
|
- 'ville': 'Lens',
|
|
|
- 'email': 'j.ellestou@entreprise.net'
|
|
|
+ $(document).ready(() => {
|
|
|
+ const loader = M.Modal.getInstance($('#loader'));
|
|
|
+ const idPagination = 'usager';
|
|
|
+ const perPage = 2;
|
|
|
+
|
|
|
+ loader.open();
|
|
|
+ $.ajax({
|
|
|
+ type: "GET",
|
|
|
+ url: "${base}api/usager/page/1/" + perPage + "/formatted/pagination",
|
|
|
+ error: () => {
|
|
|
+ loader.close();
|
|
|
},
|
|
|
- {
|
|
|
- 'nom': 'Pandragron',
|
|
|
- 'prenom': 'Artoria',
|
|
|
- 'ville': 'Lens',
|
|
|
- 'email': 'apandra@sab.er'
|
|
|
- }
|
|
|
- ],
|
|
|
- [
|
|
|
- {
|
|
|
- 'nom': 'Shepard',
|
|
|
- 'prenom': 'John',
|
|
|
- 'ville': 'Lens',
|
|
|
- 'email': 'j-shepard@sr2.normandy.fr'
|
|
|
+ success: (result) => {
|
|
|
+ loader.close();
|
|
|
+ pagination(idPagination, 1, perPage, result.data.total, $('#abo'), $('#pagination-abo'), result.data.list, null, 'action');
|
|
|
},
|
|
|
- {
|
|
|
- 'nom': 'Notece',
|
|
|
- 'prenom': 'Lea',
|
|
|
- 'ville': 'Lens',
|
|
|
- 'email': 'lea@notece.fr'
|
|
|
- }
|
|
|
- ]
|
|
|
- ]
|
|
|
-
|
|
|
- const idPagination = 'abo';
|
|
|
-
|
|
|
- $(document).ready(() => {
|
|
|
- pagination(idPagination, 1, 3, 8, $('#abo'), $('#pagination-abo'), data[0]);
|
|
|
+ });
|
|
|
|
|
|
// Detection changement page
|
|
|
- $('main').on('click', `.pagination-${idPagination}-prev`, function () {
|
|
|
+ $('main').on('click', '.pagination-' + idPagination + '-prev', function () {
|
|
|
console.log(idPagination, 'prev', $(this).attr('data-page'));
|
|
|
- pagination(idPagination, $(this).attr('data-page'), 4, 12, $('#abo'), $('#pagination-abo'), data[$(this).attr('data-page') - 1]);
|
|
|
+ loader.open();
|
|
|
+ $.ajax({
|
|
|
+ type: "GET",
|
|
|
+ url: "${base}api/usager/page/" + $(this).attr('data-page') + "/" + perPage + "/formatted/pagination",
|
|
|
+ error: () => {
|
|
|
+ loader.close();
|
|
|
+ },
|
|
|
+ success: (result) => {
|
|
|
+ loader.close();
|
|
|
+ pagination(idPagination, $(this).attr('data-page'), perPage, result.data.total, $('#abo'), $('#pagination-abo'), result.data.list, null, 'action');
|
|
|
+ },
|
|
|
+ });
|
|
|
});
|
|
|
- $('main').on('click', `.pagination-${idPagination}-next`, function () {
|
|
|
+ $('main').on('click', '.pagination-' + idPagination + '-next', function () {
|
|
|
console.log('abo', 'next', $(this).attr('data-page'));
|
|
|
- pagination(idPagination, $(this).attr('data-page'), 4, 12, $('#abo'), $('#pagination-abo'), data[$(this).attr('data-page') - 1]);
|
|
|
+ loader.open();
|
|
|
+ $.ajax({
|
|
|
+ type: "GET",
|
|
|
+ url: "${base}api/usager/page/" + $(this).attr('data-page') + "/" + perPage + "/formatted/pagination",
|
|
|
+ error: () => {
|
|
|
+ loader.close();
|
|
|
+ },
|
|
|
+ success: (result) => {
|
|
|
+ loader.close();
|
|
|
+ pagination(idPagination, $(this).attr('data-page'), perPage, result.data.total, $('#abo'), $('#pagination-abo'), result.data.list, null, 'action');
|
|
|
+ },
|
|
|
+ });
|
|
|
});
|
|
|
- $('main').on('click', `.pagination-${idPagination}-number`, function () {
|
|
|
+ $('main').on('click', '.pagination-' + idPagination + '-number', function () {
|
|
|
console.log('abo', 'num', $(this).attr('data-page'));
|
|
|
- pagination(idPagination, $(this).attr('data-page'), 4, 12, $('#abo'), $('#pagination-abo'), data[$(this).attr('data-page') - 1]);
|
|
|
+ loader.open();
|
|
|
+ $.ajax({
|
|
|
+ type: "GET",
|
|
|
+ url: "${base}api/usager/page/" + $(this).attr('data-page') + "/" + perPage + "/formatted/pagination",
|
|
|
+ error: () => {
|
|
|
+ loader.close();
|
|
|
+ },
|
|
|
+ success: (result) => {
|
|
|
+ loader.close();
|
|
|
+ pagination(idPagination, $(this).attr('data-page'), perPage, result.data.total, $('#abo'), $('#pagination-abo'), result.data.list, null, 'action');
|
|
|
+ },
|
|
|
+ });
|
|
|
});
|
|
|
});
|
|
|
</script>
|