I'm developing an application that manages Courses , I'm a beginner in ASP.NET MVC. In my application I have a screen that the Student makes your Enrollment in a course, I also have a field Number of Jobs and another field Status that says whether the course is Available or Closed , what I am trying to do is: When my Amount of vacancies reach zero the Status of the course should change to Closed . I do not know if javascript would be the best way to do this. The way I tried it is wrong and it does not work. Can someone help me?!
MyView
@model IEnumerable<MeuProjeto.Models.Curso>
<style>
#Status {
display: block;
text-align: center;
}
.encerrado {
background-color: green;
font-family: 'Times New Roman';
color: white;
}
.disponivel {
background-color: orange;
font-family: 'Times New Roman';
color: white;
}
</style>
<h2>Catálogo de Cursos</h2>
<table class="table table-hover">
<tr>
<th>
Curso
</th>
<th>
Sigla
</th>
<th>
Ementa
</th>
<th>
Inicio
</th>
<th>
Fim
</th>
<th>
Turno
</th>
<th>
Status
</th>
<th>
Quantidade de Vagas
</th>
<th></th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Nome_Curso)
</td>
<td>
@Html.DisplayFor(modelItem => item.Sigla)
</td>
<td>
<a href="~/Curso/[email protected]">Ementa</a>
</td>
<td>
@Html.DisplayFor(modelItem => item.Dt_Inicio)
</td>
<td>
@Html.DisplayFor(modelItem => item.Dt_Fim)
</td>
<td>
@Html.DisplayFor(modelItem => item.Turno)
</td>
<td>
<input type="text" name="Status" id="Status" value="@Html.DisplayFor(modelItem => item.Status)" readonly class="Status" />
</td>
<td>
@Html.DisplayFor(modelItem => item.Qtd_Vagas)
</td>
<td>
<div class="btn-group">
<div class="col-md-offset-2 col-md-10">
@using (Html.BeginForm("Inscricao", "Curso", FormMethod.Post))
{
if (item.Qtd_Vagas > 0)
{
<a class="inscricao btn btn-success" onclick="$(this).parents('form').submit(), Alerta()">Inscrição</a>
<input type="hidden" value="@item.Id" name="inscricaoId" />
}
else
{
<input type="submit" value="Não há vagas" name="detalhes" class="inscricao btn btn-default" disabled="disabled"/>
}
}
</div>
</div>
</td>
</tr>
}
</table>
<div class="form-group">
<a href="@Url.Action("HomeAluno", "Home")"><input type="button" value="Voltar" class="btn btn-danger" /></a>
</div>
<br />
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script>
$(document).ready(function() {
$(".inscricao").click(function() {
$.ajax({
type: "POST",
url: "Inscricao/",
data: { inscricaoId: $(this).data("inscricaoid") },
success: function() {
window.location.reload();
}
});
});
});
</script>
<script>
function Status() {
var st = document.getElementsByClassName("Status").value;
if (st == document.getElementsByClassName("disponivel")) {
return st;
} else {
return document.getElementsByClassName("encerrado");
}
}
</script>
<script>
$(document).ready(function() {
$('.Status').each(function() {
if ($(this).val() == "Curso Disponível") {
$(this).addClass("disponivel");
}
if ($(this).val() == "Encerrado") {
$(this).addClass("encerrado");
}
});
});
</script>
}