xppl/app/templates/show_books.html

{% extends 'base.html' %}

{% block main %}
<div class="container">
  {% from "_formhelpers.html" import render_field %}
  <form method="POST">
    <div>{{ form.select(style="width: 100px; margin: 10px; float: left; font-size: 20px") }}</div>
      <div class="search">
      {{ render_field(form.search) }} </div>
      <button type="submit" class="button">Search</button>
      </form>

  <h1 class="page-header">All Books</h1>
  {% with messages = get_flashed_messages() %}
    {% if messages %}
      <div class="alert alert-success">
        <ul>
        {% for message in messages %}
          <li>{{ message }}</li>
        {% endfor %}
        </ul>
      </div>
    {% endif %}
  {% endwith %}

  <table class="library_table" id="table" style="width:100%">
    <thead>
    <tr id="header">
      <th>Cover</th>
      <th>Title</th>
      <th>Author</th>
      <th>Filetype</th>
      <th>Category</th>
      <th>Stack</th>
    </tr>
    </thead>
    <tbody>
        {% for book in books|sort(attribute='title', reverse = False) %}
    <tr>
      <td>

        <img class="no_cover" id="{{ book.title }}" src="/uploads/cover/{{ book.cover }}" width="40" onerror="if (this.src != '/static/img/default_cover.png') this.src = '/static/img/default_cover.png';">
      <!--  <object class="no_cover" data="../static/img/default_cover.png" type="image/png" width="65">
          <p hidden="True"></p>

      </object>-->
      </td>
      <td class="title_col"><a href="books/{{ book.id }}">{{ book.title }}</a></td>

      <td class="author_col">  {% for author in book.authors %}

              <li><a href="{{url_for('show_author_by_id', id=author.id)}}">{{ author.author_name }}</a>  </li>

        {% endfor %}</td>
      <td>{{ book.fileformat }}</td>
      <td>{{ book.category}}</td>
      <td>  {% for stack in book.stacks %}

              <li><a href="{{url_for('show_stack_by_id', id=stack.id)}}">{{ stack.stack_name }}</a>  </li>
              {% endfor %}
      </td>
    </tr>

  {% endfor %}
</tbody>
  </table>


</div>
{% endblock %}