Estou fazendo um sistema em Django para controle de frequência de alunos.Tenho uma tabela/formulario HTML que é alimentada por um loop em python:
<form action="{% url 'cadastra_presenca' %}" method="POST" enctype="multipart/form-data">
{% csrf_token %}
{% for alunos in curso %}
<tr class="tbody-row">
<td class="tbody-column" style="display:none;">
<label style="display: flex; justify-content: center;display: none;">
<input type="text" class="input-3" value="{{alunos.id}}" name="id_matricula_presenca"/>
</label>
</td>
<td class="tbody-column">{{alunos.alunos.nome_aluno}}
<label style="display: flex; justify-content: center;display: none;">
<input type="text" class="input-3" value="{{alunos.alunos.nome_aluno}}" name="nome_aluno_presenca"/>
</label>
</td>
<td class="tbody-column">
<input type="date" class="input-3" value="{{data_presenca}}" readonly name="data_presenca_aluno">
</td>
<td class="tbody-column">
<label style="display: flex; justify-content: center;">
<input type="checkbox" class="presenca" checked multiple value="P" name="confirma_presenca_aluno">
<input class="ausencia" type='hidden' disabled value='F' multiple name='confirma_presenca_aluno'>
</label>
</td>
</tr>
{% endfor %}
<div style="display: flex; justify-content: center;position:relative;">
<input type="submit" class="botao-presenca" value="OK">
</div>
</form>
Entretanto, como o checkbox não envia nada se estiver desmarcado, tive que arrumar uma solução para esse problema, usando um input escondido que possui o mesmo name, para que quando o checkbox esteja unchecked o valor que o form envia é o do input hidden. Mas a "gambiarra" funciona até certo ponto.
Segue o JS que fiz para tal:
var presenca= document.querySelectorAll('.presenca');
//var ausencia = document.querySelectorAll('.ausencia');
presenca.forEach(function(p){
p.addEventListener('click',function(){
var ausente=p.parentNode.querySelector('.ausencia');
if(ausente.disabled==true){
ausente.disabled=false;
}else if(ausente.disabled==false){
ausente.disabled=true;
}
});
});
Quando eu quero fazer o formulário de edição dessas presenças, não consigo fazer com que o checkbox fique marcado quando o valor for 'P' e desmarcado se 'F' e para que o usuário, caso queira editar altere apenas aqueles que quiser.
Já tentei inclusive um loop com o type="radio" , entretanto, mesmo cada aluno tendo um radio box... eu só consigo selecionar 1 já que todos os radios tem o mesmo name.
Daria para fazer essa lista de presença usando Java Script ? Como eu faria para funcionar essa questão dos checkbox? E persistir aqueles com F e aqueles com P , desmarcados ou marcados.