{% extends 'administrator/base.html' %}
{% block title %}Student's Profile{% endblock %}
{% block body %}
    {% load static %}
    {% load widget_tweaks %}
    <main class="animated fadeIn row">
        <div class="col-md-12">
            <div class="card" style="margin-top: 10px">
                <div class="card-header">
                    <h3 class="card-title mb-0">Student Information</h3>
                </div>
                <div class="card-body">
                    <div class="container form-group">

                        {% if student_id %}
                            <form id="student_profile" METHOD="POST"
                                  action="{% url 'dashboard:administrator_student_update' student_id %}">
                        {% else %}
                            <form id="student_profile" METHOD="POST"
                                  action="{% url 'dashboard:administrator_student_add' %}">
                        {% endif %}
                        <div id="student_form">
                            {% include 'administrator/students/forms/add_student.html' %}
                        </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        {% if student_id %}
            <div class="card" style="margin-top: 10px">
            <div class="card-header">
                <h3 class="card-title mb-0">Student Courses</h3>
            </div>

            <form id="student_courses" METHOD="POST">
                <div class="card-body">
                    <table class="table table-striped table-bordered table-hover table-condensed table-responsive-sm">
                        <thead>
                        <tr>
                            <th>Course</th>
                            <th>Study Time</th>
                            <th>Failures</th>
                            <th>Absences</th>
                            <th>Family Support</th>
                            <th>Paid Class</th>
                            <th>MidTerm Grade</th>
                            <th>Final Grade</th>
                            <th>Delete</th>
                        </tr>
                        </thead>
                        <tbody id="courses_form_body">
                        {% include 'administrator/students/forms/courses_form.html' %}
                        </tbody>
                    </table>
                    <div class="col-md-12 text-center">
                        <button type="submit" class="btn btn-success" id="saveChange2">Save Change</button>
                        <button type="button" class="btn btn-success" id="cancel2">Cancel</button>
                    </div>
                </div>
            </form>
        {% endif %}
        </div>
    </main>
    <script>
        {%if student_id %}
            $("#student_profile").ajaxForm({
                type: 'post',
                success: function (response) {
                    $("#student_form").html(response);
                }
            });

            $("#student_courses").ajaxForm({
                url: "{% url 'dashboard:administrator_student_courses_update' student_id%}",
                type: 'post',
                success: function (response) {
                    $("#courses_form_body").html(response);
                }
            });
        {% endif %}
    </script>

{% endblock %}