this.CustomSelect.appendChild(itemElement);
//add the line inside of
itemElement.appendChild(spanElement);
if(optionElement.selected){
this._select(itemElement);
}
itemElement.addEventListener("click", () => {
if( this.originalSelect.Multiple
&& itemElement.classList.contains("select__item--selected")
){
this._deselect(itemElement);
}else{
this._select(itemElement);
PreEndoscopic(optionElement.value);
}
})
});
//put the code below the form
this.originalSelect.insertAdjacentElement("afterend", this.CustomSelect);
this.originalSelect.style.display = "none";
}
_select(itemElement){
const index = Array.from(this.CustomSelect.children).indexOf(itemElement);
if(!this.originalSelect.Multiple){
this.CustomSelect.querySelectorAll(".select__item").forEach(el => {
el.classList.remove("select__item--selected");
});
}
this.originalSelect.querySelectorAll("option")[index].selected = true;
itemElement.classList.add("select__item--selected");
}
_deselect(itemElement){
const index = Array.from(this.CustomSelect.children).indexOf(itemElement);
this.originalSelect.querySelectorAll("option")[index].selected = false;
itemElement.classList.remove("select__item--selected");
}
}
document.querySelectorAll(".custom-select").forEach(selectElement => {
new CustomSelect(selectElement);
})
class CustomSelect2 {
constructor(originalSelect){
//create the div class with select css attribute
this.originalSelect = originalSelect;
this.CustomSelect = document.createElement("div");
this.CustomSelect.classList.add("select");
this.originalSelect.querySelectorAll("option").forEach(optionElement => {
const itemElement = document.createElement("div");
const spanElement = document.createElement("span");
//takes the value of the option
spanElement.classList.add("btnSpan");
spanElement.textContent = optionElement.value;
itemElement.classList.add("select__item");
itemElement.textContent = optionElement.textContent;
//add the line to
this.CustomSelect.appendChild(itemElement);
//add the line inside of
itemElement.appendChild(spanElement);
if(optionElement.selected){
this._select(itemElement);
}
itemElement.addEventListener("click", () => {
if( this.originalSelect.Multiple
&& itemElement.classList.contains("select__item--selected")
){
this._deselect(itemElement);
}else{
this._select(itemElement);
CompleteRockallScore(optionElement.value);
}
})
});
//put the code below the form
this.originalSelect.insertAdjacentElement("afterend", this.CustomSelect);
this.originalSelect.style.display = "none";
}
_select(itemElement){
const index = Array.from(this.CustomSelect.children).indexOf(itemElement);
if(!this.originalSelect.Multiple){
this.CustomSelect.querySelectorAll(".select__item").forEach(el => {
el.classList.remove("select__item--selected");
});
}
this.originalSelect.querySelectorAll("option")[index].selected = true;
itemElement.classList.add("select__item--selected");
}
_deselect(itemElement){
const index = Array.from(this.CustomSelect.children).indexOf(itemElement);
this.originalSelect.querySelectorAll("option")[index].selected = false;
itemElement.classList.remove("select__item--selected");
}
}
document.querySelectorAll(".custom-select2").forEach(selectElement => {
new CustomSelect2(selectElement);
})
class CustomSelectH {
constructor(originalSelect){
//create the div class with select css attribute
this.originalSelect = originalSelect;
this.CustomSelect = document.createElement("div");
this.CustomSelect.classList.add("select2");
this.originalSelect.querySelectorAll("option").forEach(optionElement => {
const itemElement = document.createElement("div");
const spanElement = document.createElement("span");
//takes the value of the option
spanElement.classList.add("btnSpan");
spanElement.textContent = optionElement.value;
itemElement.classList.add("select__item2");
itemElement.textContent = optionElement.textContent;
//add the line to
this.CustomSelect.appendChild(itemElement);
//add the line inside of
itemElement.appendChild(spanElement);
if(optionElement.selected){
this._select(itemElement);
}
itemElement.addEventListener("click", () => {
if( this.originalSelect.Multiple
&& itemElement.classList.contains("select__item--selected2")
){
this._deselect(itemElement);
}else{
this._select(itemElement);
HemoPillData(optionElement.value);
}
})
});
//put the code below the form
this.originalSelect.insertAdjacentElement("afterend", this.CustomSelect);
this.originalSelect.style.display = "none";
}
_select(itemElement){
const index = Array.from(this.CustomSelect.children).indexOf(itemElement);
if(!this.originalSelect.Multiple){
this.CustomSelect.querySelectorAll(".select__item2").forEach(el => {
el.classList.remove("select__item--selected2");
});
}
this.originalSelect.querySelectorAll("option")[index].selected = true;
itemElement.classList.add("select__item--selected2");
}
_deselect(itemElement){
const index = Array.from(this.CustomSelect.children).indexOf(itemElement);
this.originalSelect.querySelectorAll("option")[index].selected = false;
itemElement.classList.remove("select__item--selected2");
}
}
document.querySelectorAll(".custom-selectH").forEach(selectElement => {
new CustomSelectH(selectElement);
})
//Calculating the PreEndoscopic Rockall Score.
function PreEndoscopic(){
let hemopill = document.getElementById("HemoPillCom");
let valHemoPill = 0;
const NOptions = document.getElementById("WithoutHP-Options");
//2.Get Rockall Score values to change each time a value changes in the pre-endoscopy.
let diagnosis = document.getElementById("DiagnosisCom");
let valDiagnosis = 0;
let hermorrhage = document.getElementById("HermorrhageCom");
let valHermorrhage = 0;
//1.get current selections
let age = document.getElementById("agePre");
let valAge = 0;
for (let i = 0; i