{% extends 'base.html' %}

{% load widget_tweaks %}

{% block content %}

<h4 class="" style="background-color: rgb(255, 255, 255)">Folders not linked to {{investigation.name}}</h4>

<div class="container">
    <form action="studies" method="post">
        {% csrf_token %}
        {{ form.errors }}
        {{ form.non_field_errors }}

        <table id="table" data-page-length='25' class="table table-striped table-bordered ">
            <thead>
                <tr>
                    <th>Folder Name</th>
                </tr>
            </thead>
            <tbody>

                {% for obj in form %}
                {% for fold in obj %}
                <tr>
                    <td><i class="fa fa-folder ic-w mr-1 folder"></i>{{ fold }}</td>
                </tr>

                {% empty %}
                <tr>
                    <td colspan="4">All studies already linked</td>
                </tr>
                {% endfor %}
                {% endfor %}

            </tbody>
        </table>
        <button type="button" onclick="select_all()">Select All</button>
        <button type="button" onclick="deselect_all()">Deselect All</button>
        <br>
        <br>
        <button type="button" class="btn btn-secondary" onClick="window.history.go(-1);"> Back </button>
        <input type="submit" class="btn btn-primary" value="Link Folder">
    </form>
    </br>
</div>

<script>
    function select_all() {
        $('input[type=checkbox]').prop('checked', true);
    }

    function deselect_all() {
        $('input[type=checkbox]').prop('checked', false);
    }
</script>

{% endblock %}