{% if courses is defined%}
    <div class="col-12 col-sm-1 col-md-1 col-lg-2 ">
    </div>
    <div class="col-12 col-sm-10 col-md-10 col-lg-8  ">
        <select id="evaluation_course"  required="required" class="ChoiceCourse form-control" name="ChoiceCourse">
            {%for course in courses%}
                <option value="{{course.id}}">{{course.wording}}</option>
            {% endfor %}
        </select>
        <br/>
        
    </div>
    <div class="col-12 col-sm-1 col-md-1 col-lg-2  ">
    </div>
{% endif %}
{% if students is defined%}
    
    <div class="col-12">
        
        
                        
        <table class="table table-bordered table-hover table-sortable table-responsive" id="tab_logic">

            <thead>
                <tr>
                    <th  class="text-center col-12 col-sm-5 col-md-5 col-lg-3" >Nom et prénom</th>
                    <th  class="text-center col-12 col-sm-5 col-md-5 col-lg-3" >Note de session</th>

                    <th class="text-center col-12 col-sm-3 col-md-3 col-lg-3" >Appr.</th>
                    <th  class="text-center col-12 col-sm-3 col-md-3 col-lg-3" >Poids</th>
                </tr>
            </thead>
            
            <tbody>

                {%for student in students%}
                    <tr id='addr0' data-id="0" class="hidden">
                       
                        <td data-name="name">
                            {{student.lastname}} {{student.firstname}}
                        </td>
                        <td data-name="desc">
                            <input type="number" id="{{student.matricule}}"  placeholder="0...20"
                                   min="0" max="20" class="form-control value" name="{{student.matricule}}note"/>
                        </td>
                        <td data-name="desc">
                            <input type="text" placeholder="Appréciation" class="form-control appreciation" name="{{student.matricule}}appr"/>
                        </td>
                        <td data-name="desc">
                            <input type="number" min="0" max="1" class="form-control appreciation" value="1" name="{{student.matricule}}appr"/>
                        </td>
                    </tr>
                {% endfor %}

            </tbody>

        </table>
    </div>
   
{% endif %}
{% block javascripts %}

    <script type="text/javascript" src="{{ asset('assets/js/jquery.js') }}"></script>
    <script type="text/javascript" >
        
        $(function () {
            
            $("td input.value").change(function () {
                var note = $(this).val();
                note = parseInt(note);

               if (note >= 0 && note < 10) {
                    $(this).parent().next().children().val("NA");
                }
                if (note >= 10 && note < 14) {
                    $(this).parent().next().children().val("EA/IA");
                }
                if (note >= 14 && note < 17) {
                    $(this).parent().next().children().val("A");
                }
                if (note >= 17 && note <= 20) {
                    $(this).parent().next().children().val("E");
                }
            });
        });
    </script>
{% endblock javascripts %}