Added UI validation for the total number of infected people

This commit is contained in:
Luis Aleixo 2022-09-20 14:48:46 +02:00
parent 6aeadc2797
commit 01e3bf8ca5
2 changed files with 27 additions and 12 deletions

View file

@ -195,16 +195,26 @@ function set_disabled_status(id, option) {
$(id).removeClass("disabled");
}
function setMaxInfectedPeople() {
$("#training_limit_error").hide();
var max = $("#total_people").val()
function validateMaxInfectedPeople() {
let infected_people = document.getElementById("infected_people");
removeErrorFor(infected_people);
$(infected_people).removeClass("red_border");
let infected = infected_people.valueAsNumber;
let max = document.getElementById("total_people").valueAsNumber;
if ($("#activity_type").val() === "training") {
max = 1;
$("#training_limit_error").show();
if ($("#activity_type").val() === "training" && infected > 1) {
insertErrorFor(infected_people, "Conference/Training activities limited to 1 infected person.");
$(infected_people).addClass("red_border");
return false;
}
else if (infected >= max) {
insertErrorFor(infected_people, "Value is equal or higher than the total number of occupants.");
$(infected_people).addClass("red_border");
return false;
}
$("#infected_people").attr("max", max);
return true;
}
function removeInvalid(id) {
@ -497,6 +507,9 @@ function validate_form(form) {
}
}
//Validate number of infected people
if (!validateMaxInfectedPeople()) submit = false;
//Validate all non zero values
$("input[required].non_zero").each(function() {
if (!validateValue(this)) {
@ -876,9 +889,11 @@ $(document).ready(function () {
// Setup the maximum number of people at page load (to handle back/forward),
// and update it when total people is changed.
setMaxInfectedPeople();
$("#total_people").change(setMaxInfectedPeople);
$("#activity_type").change(setMaxInfectedPeople);
validateMaxInfectedPeople();
$("#total_people").change(validateMaxInfectedPeople);
$("#activity_type").change(validateMaxInfectedPeople);
$("#total_people").change(validateMaxInfectedPeople);
$("#infected_people").change(validateMaxInfectedPeople);
//Validate all non zero values
$("input[required].non_zero").each(function() {validateValue(this)});

View file

@ -313,8 +313,8 @@
</div>
<div class="form-group row">
<div class="col-sm-4"><label class="col-form-label">Number of infected people: </label></div>
<div class="col-sm-6 align-self-center"><input type="number" id="infected_people" class="form-control" name="infected_people" min=1 value=1 required></div>
<div class="col-sm-4" style="top: -2px"><label>Number of infected people: </label></div>
<div class="col-sm-6"><input type="number" id="infected_people" class="form-control" name="infected_people" min=1 value=1 required></div>
</div>
<span id="training_limit_error" class="red_text" hidden>Conference/Training activities limited to 1 infected<br></span>