- !DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Search usng filtering in the book list</title>
- <link rel="stylesheet" type="text/css" href="/webjars/bootstrap/css/bootstrap.min.css">
- <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
- <script type="text/javascript" src="/webjars/jquery/jquery.min.js"></script>
- <script type="text/javascript" src="/webjars/bootstrap/js/bootstrap.min.js"></script>
- <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
- <link rel="stylesheet" href="/resources/demos/style.css">
- <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
- <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
- <script>
- $( function() {
- $( "#publisheddate" ).datepicker();
- } );
- </script>
- </head>
- <body>
- <nav class="navbar navbar-inverse">
- <div class="container-fluid">
- <h3>Searching using filtering the book list</h3>
- </div>
- </nav>
- <div class="container">
- <div class="row">
- <form class="form-horizontal" action="filter.html" method="POST">
- <div class="form-group">
- <label class="col-lg-2 control-label">Author: </label>
- <div class="col-lg-4">
- <input type="text" class="form-control" name="author" placeholder="Author">
- </div>
- <label class="col-lg-2 control-label">Title: </label>
- <div class="col-lg-4">
- <input type="text" class="form-control" name="title" placeholder="Title">
- </div>
- <label class="col-lg-2 control-label">Description: </label>
- <div class="col-lg-4">
- <input type="text" class="form-control" name="description" placeholder="Description">
- </div>
- <div class="form-group">
- <label class="col-lg-2 control-label">Published date: </label>
- <div class="col-lg4">
- <input type="text" id="publisheddate" class="form-control">
- </div>
- </div>
- <div class="form-group">
- <label class="col-lg-2 control-label"></label>
- <div class="col-lg4">
- <button onclick="filterBooks(author,title,description,publishedDate)">Search</button>
- </div>
- </div>
- </div>
- </form>
- </div>
- </div>
- <div>
- <table class="table table-striped table-bordered">
- <thead class="thead-dark">
- <tr>
- <th>Book ID</th>
- <th>Title</th>
- <th>Author</th>
- <th>Genre</th>
- <th>Price</th>
- <th>Publish Date</th>
- <th>Description</th>
- <th>Borrowed</th>
- <th>Borrowed By</th>
- </tr>
- </thead>
- <tbody>
- <tr th:each="book: ${filterBooks}">
- <td th:text="${book.getId}"> Book-ID </td>
- <td th:text="${book.getTitle}">Title </td>
- <td th:text="${book.author}">Author</td>
- <td th:text="${book.genre}">Genre</td>
- <td th:text="${book.price}">Price</td>
- <td th:text="${book.publish_date}">Publish-Date</td>
- <td th:text="${book.description}">Description</td>
- <td th:text="${book.borrowed}">Borrowed</td>
- <td th:text="${book.borrowedBy}">Borrowed-By</td>
- <td><input type="checkbox" field="*{requestedBooks}" value="${book.id}" /></td>
- </tbody>
- </table>
- </div>
- <div class="btn-group">
- <button onclick="borrowBook(userEmail, bookIds, model)">Borrow</button>
- <button onclick="returnBook(userEmail, bookId)">Return</button>
- </div>
- </body>
- </html>
[text] filter.html
Viewer
*** This page was generated with the meta tag "noindex, nofollow". This happened because you selected this option before saving or the system detected it as spam. This means that this page will never get into the search engines and the search bot will not crawl it. There is nothing to worry about, you can still share it with anyone.
Editor
You can edit this paste and save as new: