added jquery data table to list

This commit is contained in:
Dinesh Edirisinghe 2019-09-22 13:18:09 +05:30
parent 7ef045dac8
commit af08f5039d
5 changed files with 11 additions and 3 deletions

1
.gitignore vendored
View file

@ -14,3 +14,4 @@ target/*
!.vscode/launch.json !.vscode/launch.json
!.vscode/extensions.json !.vscode/extensions.json
_site/ _site/
/bin/

View file

@ -18,6 +18,7 @@
<![endif]--> <![endif]-->
<link rel="stylesheet" th:href="@{/resources/css/petclinic.css}"/> <link rel="stylesheet" th:href="@{/resources/css/petclinic.css}"/>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.css">
</head> </head>
@ -88,6 +89,12 @@
<script th:src="@{/webjars/jquery/jquery.min.js}"></script> <script th:src="@{/webjars/jquery/jquery.min.js}"></script>
<script th:src="@{/webjars/jquery-ui/jquery-ui.min.js}"></script> <script th:src="@{/webjars/jquery-ui/jquery-ui.min.js}"></script>
<script th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script> <script th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.js"></script>
<script type="text/javascript">
$(document).ready( function () {
$('.data_table').DataTable();
});
</script>
</body> </body>

View file

@ -6,7 +6,7 @@
<h2>Owners</h2> <h2>Owners</h2>
<table id="owners" class="table table-striped"> <table id="owners" class="table table-striped data_table">
<thead> <thead>
<tr> <tr>
<th style="width: 150px;">Name</th> <th style="width: 150px;">Name</th>

View file

@ -7,7 +7,7 @@
<h2>Veterinarians</h2> <h2>Veterinarians</h2>
<table id="vets" class="table table-striped"> <table id="vets" class="table table-striped data_table">
<thead> <thead>
<tr> <tr>
<th>Name</th> <th>Name</th>

View file

@ -4,7 +4,7 @@
<body> <body>
<h2 th:text="#{welcome}">Welcome</h2> <h2 th:text="#{welcome}">Welcomee</h2>
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<img class="img-responsive" src="../static/resources/images/pets.png" th:src="@{/resources/images/pets.png}"/> <img class="img-responsive" src="../static/resources/images/pets.png" th:src="@{/resources/images/pets.png}"/>