added in loans support, also particular route for book_for_loan without markup used as div content on loan.html page via ajax load

templates/books_for_loan.html

@@ -0,0 +1,17 @@
+	<h3>Loaned Books</h1>
+	<table id="book_table" class="table table-striped table-sm" data-toolbar="#toolbar" data-search="true">
+	  <thead>
+	  <tr class="thead-light"><th>Title</th></tr>
+	  </thead>
+	  <tbody>
+      {% for book in books %}
+        <tr>
+		  {% if book.sub_book_num is defined %}
+		  	<td data-sort="{{book.parent_id}}.{{book.sub_book_num}}"><a href="/book/{{book.id}}">&nbsp;&nbsp;&nbsp;&nbsp;{{book.title}}</a></td>
+		  {% else %}
+		  	<td data-sort="{{book.id}}"><a href="/book/{{book.id}}">{{book.title}}</a></td>
+		  {% endif %}
+		</tr>
+      {% endfor %}
+	</tbody>
+	</table>

templates/loan.html

@@ -0,0 +1,53 @@
+{% extends "base.html" %}
+{% block main_content %}
+	<div class="container">
+		<h3 class="col-lg-12"><center>Loan</center></h3>
+		{% if message|length %}
+			<div class="row alert alert-{{alert}}">
+			{{message}}
+			</div>
+		{% endif %}
+		<div class="row">
+			<div class="col-lg-8">
+			<form class="form form-inline col-lg-12" action="" method="POST">
+				{{ loan_form.csrf_token }}
+				{{ loan_form.id }}
+				<div class="form-row col-lg-12">
+				{{ loan_form.firstnames.label( class="col-lg-2" ) }}
+				{{ loan_form.firstnames( class="form-control col-lg-10" ) }}
+				</div class="form-row">
+				<div class="form-row col-lg-12">
+				{{ loan_form.surname.label( class="col-lg-2" ) }}
+				{{ loan_form.surname( class="form-control col-lg-10" ) }}
+				</div class="form-row">
+				<div class="form-row col-lg-12">
+				{{ loan_form.date_lent.label( class="col-lg-2" ) }}
+				{{ loan_form.date_lent( class="form-control col-lg-10" ) }}
+				</div class="form-row">
+				<div class="form-row col-lg-12">
+				{{ loan_form.contact_details.label( class="col-lg-2" ) }}
+				{{ loan_form.contact_details( class="form-control col-lg-10", rows="5" ) }}
+				</div class="form-row">
+				<div class="row col-lg-12">
+				<br>
+				</div class="row">
+				<div class="form-row col-lg-12">
+					{{ loan_form.delete( class="btn btn-outline-danger col-lg-2" )}}
+					{{ loan_form.submit( class="btn btn-primary col-lg-2" )}}
+				</div class="form-row">
+			</form>
+			</div class="col-lg-8">
+			<div class="col-lg-4">
+				<div id="books_for_loan_bit">
+				</div id="books_for_loan_bit">
+			</div class="col-lg-4">
+		</div class="row">
+	</div class="container">
+{% endblock main_content %}
+{% block script_content %}
+	<script>
+		$(document).ready( function() {
+			$("#books_for_loan_bit").load("/books_for_loan/" + {{loan_form.data.id}})
+		} )
+	</script>
+{% endblock script_content %}

templates/loans.html

@@ -0,0 +1,16 @@
+{% extends "base.html" %}
+
+{% block main_content %}
+<h3>Loans</h3>
+<table id="book_table" class="table table-striped table-sm" data-toolbar="#toolbar" data-search="true">
+	<thead>
+		<tr class="thead-light"><th>Surname</th><th>Firstname(s)</th><th>Date Lent</th><th>Contact Details</th></tr>
+	</thead>
+	<tbody>
+	{% for loan in loans %}
+		<tr><td><a href="{{url_for('loan', id=loan.id )}}">{{loan.surname}}</a></td><td>{{loan.firstnames}}</td><td>{{loan.date_lent}}</td>
+		<td>{{loan.contact_details}}</td></tr>
+	{% endfor %}
+	</tbody>
+</table>
+{% endblock main_content %}