{% extends 'layout/backEndLayout.html.twig' %}
{% block content %}
{% form_theme form 'bootstrap_4_layout.html.twig' %}
<div class="col-12 jumbotron" >
<div class="row mt-4 mx-auto box-shadow">
<div class="card-header">
<h3 class="my-0 text-center text-justify text-uppercase"> Nouvelle fiche d evaluation</h3>
</div>
<div class="mt-4 col-md-12 col-sm-12 table-responsive">
<div class="row">
<div class="col-2 table-responsive"></div>
<div class="col-8 table-responsive">
{{ form_start(form, {action: path('admin_evaluations_create'),'attr': {'id': 'formEvaluation', 'class':'evaluation'} }) }}
<p>
{{ form_widget(form.sequence ,{'attr':{'class':'ChoiceSequence'} } ) }}
</p>
<p>
{{ form_widget(form.classRoom,{'attr':{'class':'ChoiceClassRoom', 'name' :'ChoiceClassRoom', 'id':'ChoiceClassRoom'} }) }}
</p>
<p>
{{ form_widget(form.competence,{'attr':{'class':'form form-control'} }) }}
</p>
</div>
<div class="col-2 table-responsive"></div>
</div>
</div>
<div id="ficheBodyStudents" class=" col-md-12 row">
{% include "evaluation/liststudents.html.twig" %}
</div>
</div>
<div class="row mt-2 mx-auto">
<div class=" col-3">
</div>
<div class=" col-3 mx-auto btn-group d-inline-flex p-2 bd-highlight">
<button class="btn btn-danger" type="submit">
<b>
<i class="fa fa-balance-scale"></i>submit</b>
</button>
</div>
<div class=" col-3 mx-auto btn-group d-inline-flex p-2 bd-highligh">
<a class="btn btn-info" href="{{ path('admin_evaluations') }}">
<i class="fa fa-list"></i>
{{ 'Back to the list'|trans({}, 'admin') }}
</a>
</div>
<div class=" col-3">
</div>
</div>
{{ form_end(form) }}
</div>
{% endblock %}
{% block footer %}
{{ parent() }}
{% endblock %}
{% block javascripts %}
{{parent()}}
<script type="text/javascript">
var classRoom = document.getElementById("evaluation_classRoom"),
competence = document.getElementById("evaluation_competence"),
idclassroom,
idcourse,
idsequence,
formEval = document.getElementById("formEvaluation");
classRoom.setAttribute('name', 'ChoiceClassRoom');
idsequence = $("select.ChoiceSequence option:selected").val();
$(".ChoiceClassRoom").change(function () {
idclassroom = $("select.ChoiceClassRoom option:selected").val();
$.ajax({
type: "POST",
url: "{{ path('admin_classroom_students') }}",
data: {
idclassroom: idclassroom,
idsequence: idsequence
},
datatype: "json",
success: function (data) {
$("#ficheBodyStudents").html(data).show();
}
});
});
var marksJson = [],
postData;
$(function () {
$(document).on('submit', 'form', function (e) { // il est impératif de commencer avec cette méthode qui va empêcher le navigateur d'envoyer le formulaire lui-même
e.preventDefault();
$("input[max=20]").each(function (index) {
marksJson.push({"matricule": $(this).attr('id'), "note": $(this).val(), "appreciation": $(this).parent().next().children().val(), "weight": $(this).parent().next().next().children().val()});
});
idcourse = $("select.ChoiceCourse option:selected").val();
postData = {
"marks": JSON.stringify(marksJson),
"idroom": idclassroom,
"idcourse": idcourse,
"idsequence": idsequence,
"competence": competence.value
};
$.ajax({
type: "POST",
url: "{{ path('admin_evaluations_create') }}",
data: postData,
datatype: "json",
success: function (data) {
alert("Enregistre avec succes.");
},
error: function (e) {
console.log(e.message);
alert("Echec.");
}
});
});
});
</script>
{% endblock javascripts %}