Merge branch 'develop/form-fixes' into 'master'
Fixed issues with form submission See merge request cara/cara!43
This commit is contained in:
commit
3899a403c3
2 changed files with 62 additions and 31 deletions
|
|
@ -18,7 +18,7 @@
|
|||
Beta v1.0.0 <span style="float:right; font-weight:bold">Please send feedback to <a href="mailto:CARA-dev@cern.ch">CARA-dev@cern.ch</a></span>
|
||||
<h1> <p><b>CARA</b> Covid Airborne Risk Assessment tool</p></h1>
|
||||
|
||||
<form id="covid_calculator" name="covid_calculator" action="/calculator/report" method="POST">
|
||||
<form id="covid_calculator" name="covid_calculator" action="/calculator/report" method="POST"> <!--DEBUG onsubmit="debug_submit(this)"-->
|
||||
|
||||
<div style="width: 33%; float:left;">
|
||||
|
||||
|
|
@ -36,14 +36,15 @@ Beta v1.0.0 <span style="float:right; font-weight:bold">Please send feedback to
|
|||
|
||||
<!-- Ventilation Options -->
|
||||
Ventilation type:
|
||||
<input type="radio" id="mechanical" name="ventilation_type" value="mechanical" onclick="show_hide('DIVmechanical_ventilation', 'DIVnatural_ventilation', this)">Mechanical</input>
|
||||
<input type="radio" id="natural" name="ventilation_type" value="natural" onclick="show_hide('DIVnatural_ventilation', 'DIVmechanical_ventilation', this)">Natural</input><br>
|
||||
<input type="hidden" id="no_ventilation" name="ventilation_type" value="" />
|
||||
<input type="hidden" id="ventilation_type" name="ventilation_type" value=""/>
|
||||
<input type="radio" id="mechanical" name="RADIO_ventilation_type" value="mechanical" onclick="show_hide('DIVmechanical_ventilation', 'DIVnatural_ventilation', this)">Mechanical</input>
|
||||
<input type="radio" id="natural" name="RADIO_ventilation_type" value="natural" onclick="show_hide('DIVnatural_ventilation', 'DIVmechanical_ventilation', this)">Natural</input><br>
|
||||
|
||||
<div id="DIVmechanical_ventilation" style="display:none">
|
||||
<input type="radio" id="air_type_supply" name="mechanical_ventilation_type" value="air_supply" onclick="require_fields(this)">
|
||||
Air supply flow rate <input type="number" step=0.01 id="air_supply" name="air_supply" min="0" placeholder="(m³)"><br>
|
||||
<input type="radio" id="air_type_changes" name="mechanical_ventilation_type" value="air_changes" onclick="require_fields(this)">
|
||||
<input type="hidden" id="mechanical_ventilation_type" name="mechanical_ventilation_type" value=""/>
|
||||
<input type="radio" id="air_type_supply" name="RADIO_mechanical_ventilation_type" value="air_supply" onclick="require_fields(this)">
|
||||
Air supply flow rate <input type="number" step=0.01 id="air_supply" name="air_supply" min="0" placeholder="(m³ / hour)"><br>
|
||||
<input type="radio" id="air_type_changes" name="RADIO_mechanical_ventilation_type" value="air_changes" onclick="require_fields(this)">
|
||||
Air changes per hour <input type="number" step=0.01 id="air_changes" name="air_changes" min="0"><br>
|
||||
</div>
|
||||
|
||||
|
|
@ -90,11 +91,11 @@ Beta v1.0.0 <span style="float:right; font-weight:bold">Please send feedback to
|
|||
<hr width="80%">
|
||||
|
||||
When is the event?<br>
|
||||
<input type="radio" id="event_type_single" name="event_type" value="single_event" onclick="require_fields(this)"></input>
|
||||
<input type="radio" id="event_type_single" name="event_type" value="single_event" onclick="require_fields(this)" required></input>
|
||||
<label for="event_type_single">Single event</label>
|
||||
<label for="datepicker">Date: </label>
|
||||
<input type="text" id="datepicker" name="single_event_date"><br>
|
||||
<input type="radio" id="event_type_recurrent" name="event_type" value="recurrent_event" onclick="require_fields(this)"></input>
|
||||
<input type="radio" id="event_type_recurrent" name="event_type" value="recurrent_event" onclick="require_fields(this)" required></input>
|
||||
<label for="event_type_recurrent">Recurrent usage</label>
|
||||
<select id="recurrent_event_month" name="recurrent_event_month">
|
||||
<option value="January">January</option>
|
||||
|
|
|
|||
|
|
@ -12,19 +12,21 @@ function show(show, var_id, obj) {
|
|||
}
|
||||
|
||||
function show_hide(show, hide, obj) {
|
||||
|
||||
var show = document.getElementById(show);
|
||||
var hide = document.getElementById(hide);
|
||||
var no_ventilation = document.getElementById("no_ventilation");
|
||||
var ventilation_type = document.getElementById("ventilation_type");
|
||||
var mechanical_ventilation_type = document.getElementById("mechanical_ventilation_type");
|
||||
|
||||
if (show.style.display === "block") {
|
||||
show.style.display = "none";
|
||||
obj.checked = false;
|
||||
no_ventilation.checked = true;
|
||||
ventilation_type.value = "";
|
||||
mechanical_ventilation_type.value = "";
|
||||
} else if (show.style.display === "none") {
|
||||
show.style.display = "block";
|
||||
hide.style.display = "none";
|
||||
require_fields(obj);
|
||||
ventilation_type.value = obj.id;
|
||||
} }
|
||||
|
||||
/* -------Required fields------- */
|
||||
|
|
@ -71,37 +73,46 @@ function require_fields(obj){
|
|||
} }
|
||||
|
||||
function require_room_volume(option) {
|
||||
$("#room_volume").prop('required',option);
|
||||
$("#room_volume").prop('required',option);
|
||||
}
|
||||
|
||||
function require_room_dimensions(option) {
|
||||
$("#floor_area").prop('required',option);
|
||||
$("#ceiling_height").prop('required',option);
|
||||
$("#floor_area").prop('required',option);
|
||||
$("#ceiling_height").prop('required',option);
|
||||
}
|
||||
|
||||
function require_mechanical_ventilation(option) {
|
||||
$("#air_type_changes").prop('required',option);
|
||||
$("#air_type_supply").prop('required',option);
|
||||
}
|
||||
$("#air_type_changes").prop('required',option);
|
||||
$("#air_type_supply").prop('required',option);
|
||||
if (!option) {
|
||||
var mechanical_ventilation_type = document.getElementById("mechanical_ventilation_type");
|
||||
mechanical_ventilation_type.value = "";
|
||||
} }
|
||||
|
||||
function require_natural_ventilation(option) {
|
||||
$("#windows_number").prop('required',option);
|
||||
$("#window_height").prop('required',option);
|
||||
$("#window_width").prop('required',option);
|
||||
$("#opening_distance").prop('required',option);
|
||||
$("#always").prop('required',option);
|
||||
$("#interval").prop('required',option);
|
||||
$("#event_type_single").prop('required',option);
|
||||
$("#event_type_recurrent").prop('required',option);
|
||||
$("#windows_number").prop('required',option);
|
||||
$("#window_height").prop('required',option);
|
||||
$("#window_width").prop('required',option);
|
||||
$("#opening_distance").prop('required',option);
|
||||
$("#always").prop('required',option);
|
||||
$("#interval").prop('required',option);
|
||||
$("#event_type_single").prop('required',option);
|
||||
$("#event_type_recurrent").prop('required',option);
|
||||
}
|
||||
|
||||
function require_air_changes(option) {
|
||||
$("#air_changes").prop('required',option);
|
||||
}
|
||||
$("#air_changes").prop('required',option);
|
||||
if (option) {
|
||||
var mechanical_ventilation_type = document.getElementById("mechanical_ventilation_type");
|
||||
mechanical_ventilation_type.value = "air_changes";
|
||||
} }
|
||||
|
||||
function require_air_supply(option) {
|
||||
$("#air_supply").prop('required',option);
|
||||
}
|
||||
$("#air_supply").prop('required',option);
|
||||
if (option) {
|
||||
var mechanical_ventilation_type = document.getElementById("mechanical_ventilation_type");
|
||||
mechanical_ventilation_type.value = "air_supply";
|
||||
} }
|
||||
|
||||
function require_single_event(option) {
|
||||
$("#datepicker").prop('required',option);
|
||||
|
|
@ -136,5 +147,24 @@ function show_disclaimer() {
|
|||
btnText.innerHTML = "Read less";
|
||||
moreText.style.display = "inline";
|
||||
$("#DIALOG_welcome").dialog("option", "height", 600);
|
||||
}
|
||||
} }
|
||||
|
||||
/* -------Debugging------- */
|
||||
function debug_submit(form){
|
||||
|
||||
//Prevent default posting of form - put here to work in case of errors
|
||||
event.preventDefault();
|
||||
|
||||
//Serialize the data in the form
|
||||
var serializedData = objectifyForm($(form).serializeArray());
|
||||
|
||||
console.log( serializedData );
|
||||
return false; //don't submit
|
||||
}
|
||||
|
||||
function objectifyForm(formArray) {
|
||||
var returnArray = {};
|
||||
for (var i = 0; i < formArray.length; i++)
|
||||
returnArray[formArray[i]['name']] = formArray[i]['value'];
|
||||
return returnArray;
|
||||
}
|
||||
Loading…
Reference in a new issue