Fix report form display
This commit is contained in:
parent
1066e50cc7
commit
f55bcebee1
1 changed files with 25 additions and 13 deletions
|
@ -58,12 +58,16 @@ function getDataFromEndpoint(url, callback) {
|
||||||
// Wraps a Bootstrap form group around a field
|
// Wraps a Bootstrap form group around a field
|
||||||
function createFormGroup(key, field) {
|
function createFormGroup(key, field) {
|
||||||
const formGroup = document.createElement("div")
|
const formGroup = document.createElement("div")
|
||||||
formGroup.classList.add("form-group");
|
formGroup.classList.add("form-group", "row");
|
||||||
|
|
||||||
const label = document.createElement("label");
|
const label = document.createElement("label");
|
||||||
|
label.classList.add("col-sm-2", "col-form");
|
||||||
label.innerHTML = field.label;
|
label.innerHTML = field.label;
|
||||||
label.setAttribute("for", key);
|
label.setAttribute("for", key);
|
||||||
|
|
||||||
|
const div = document.createElement("div");
|
||||||
|
div.classList.add("col-sm-10");
|
||||||
|
|
||||||
const input = document.createElement("input");
|
const input = document.createElement("input");
|
||||||
input.name = key;
|
input.name = key;
|
||||||
input.id = key;
|
input.id = key;
|
||||||
|
@ -74,10 +78,18 @@ function createFormGroup(key, field) {
|
||||||
if (field.value === true)
|
if (field.value === true)
|
||||||
input.setAttribute("checked", "checked");
|
input.setAttribute("checked", "checked");
|
||||||
input.classList.add("form-check-input");
|
input.classList.add("form-check-input");
|
||||||
formGroup.classList.add("form-check");
|
label.className = "";
|
||||||
label.classList.add("form-check-label");
|
label.classList.add("form-check-label");
|
||||||
formGroup.appendChild(input); // Reversed order compared to others
|
outerLabel = document.createElement("div");
|
||||||
formGroup.appendChild(label);
|
outerLabel.classList.add("col-sm-2");
|
||||||
|
outerLabel.innerHTML = "Flight type";
|
||||||
|
formCheck = document.createElement("div");
|
||||||
|
formCheck.classList.add("form-check");
|
||||||
|
formCheck.appendChild(input);
|
||||||
|
formCheck.appendChild(label);
|
||||||
|
div.appendChild(formCheck);
|
||||||
|
formGroup.appendChild(outerLabel);
|
||||||
|
formGroup.appendChild(div);
|
||||||
break;
|
break;
|
||||||
case "date":
|
case "date":
|
||||||
case "decimal":
|
case "decimal":
|
||||||
|
@ -85,19 +97,19 @@ function createFormGroup(key, field) {
|
||||||
input.value = field.value;
|
input.value = field.value;
|
||||||
input.classList.add("form-control");
|
input.classList.add("form-control");
|
||||||
formGroup.appendChild(label);
|
formGroup.appendChild(label);
|
||||||
formGroup.appendChild(input);
|
div.appendChild(input)
|
||||||
|
formGroup.appendChild(div);
|
||||||
break;
|
break;
|
||||||
case "file":
|
case "file":
|
||||||
input.type = "file";
|
input.type = "file";
|
||||||
input.classList.add("form-control-file");
|
input.classList.add("form-control-file");
|
||||||
|
let uploadMessage = document.createElement("p");
|
||||||
|
uploadMessage.classList.add("form-text");
|
||||||
|
uploadMessage.innerHTML = field.value;
|
||||||
|
div.appendChild(input)
|
||||||
|
div.appendChild(uploadMessage);
|
||||||
formGroup.appendChild(label);
|
formGroup.appendChild(label);
|
||||||
formGroup.appendChild(input);
|
formGroup.appendChild(div);
|
||||||
let uploadMessage = document.createTextNode("Uploaded file:");
|
|
||||||
formGroup.appendChild(uploadMessage);
|
|
||||||
const link = document.createElement("a");
|
|
||||||
link.href = field.value;
|
|
||||||
link.innerHTML = field.value;
|
|
||||||
formGroup.appendChild(link);
|
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
break;
|
break;
|
||||||
|
@ -153,7 +165,7 @@ function createEditReportForm(parsedData) {
|
||||||
col.removeChild(col.firstChild)
|
col.removeChild(col.firstChild)
|
||||||
}
|
}
|
||||||
|
|
||||||
// Add report title and date to card header
|
// Add report title and date
|
||||||
const reportTitle = parsedData.title;
|
const reportTitle = parsedData.title;
|
||||||
const dateCreated = new Date(parsedData.date_created).toLocaleDateString("en-US");
|
const dateCreated = new Date(parsedData.date_created).toLocaleDateString("en-US");
|
||||||
const h3 = document.createElement("h3");
|
const h3 = document.createElement("h3");
|
||||||
|
|
Loading…
Reference in a new issue