JSFiddle - React, Tailwind, and code Playground
HTML
<table>
<tr>
<td>
<label for="analogue_rapides">Analogues rapides<br>
<select class="input" id="analogue_rapides" name="analogue_rapides" style="width:130px">
<option>choisissez...</option>
<option value="apidra">Apidra</option>
<option value="novorapid">Novorapid</option>
<option value="humalog">Humalog</option>
<option value="autre">Autre</option>
</select></label>
</td>
<td>
<label for="dose_analogue">Dose<br>
<input type="number" min="1" max="4" step="1" tabindex="10" size="20" value="" class="input" id="dose_analogue" name="dose_analogue"></label><br>
<label for="injection_analogue">Nombre d'injection/jour<br>
<input type="number" min="1" max="4" step="1" tabindex="10" size="20" value="" class="input" id="injection_analogue" name="injection_analogue"></label>
</td>
<td>
<label for="doseT_analogue">Dose totale<br>
<input type="text" tabindex="10" size="20" value="---" class="input" id="doseT_analogue" name="doseT_analogue" disabled="disabled"></label> (UI/j)
</td>
</tr>
<tr>
<td>
<label for="analogue_lentes">Analogues lentes<br>
<select class="input" id="analogue_lentes" name="analogue_lentes" style="width:130px">
<option>choisissez...</option>
<option value="lantus">Lantus</option>
<option value="levemir">Levemir</option>
<option value="insulatard">Insulatard</option>
<option value="autre">Autre</option>
</select></label>
</td>
<td>
<label for="dose_analogueL">Dose<br>
<input type="number" min="1" max="4" step="1" tabindex="10" size="20" value="" class="input" id="dose_analogueL" name="dose_analogueL"></label><br>
<label for="injection_analogueL">Nombre d'injection/jour<br>
<input type="number" min="1" max="4" step="1" tabindex="10" size="20" value="" class="input" id="injection_analogueL" name="injection_analogueL"></label>
</td>
<td>
<label for="doseT_analogueL">Dose...
JavaScript
var e13 = document.getElementById("analogue_rapides");
var elem_dose_analogue = document.getElementById("dose_analogue");
var elem_injection_analogue = document.getElementById("injection_analogue");
function calcul_mgj13() {
var list_idx = e13.options[e13.selectedIndex].index;
var nb_mg = document.getElementById("dose_analogue");
var mg = parseFloat(nb_mg.value);
var elem_dose = document.getElementById("injection_analogue");
var dose = parseFloat(elem_dose.value);
var elem_result = document.getElementById("doseT_analogue");
if (elem_dose.value != ''){
elem_result.value = parseFloat(mg * dose).toFixed(2);
}
e15.disabled=(list_idx > 0);
elem_dose_analogueM.disabled=(list_idx > 0);
elem_injection_analogueM.disabled=(list_idx > 0);
}
elem_dose_analogue.addEventListener("blur", calcul_mgj13);
elem_injection_analogue.addEventListener("blur", calcul_mgj13);
var e14 = document.getElementById("analogue_lentes");
var elem_dose_analogueL = document.getElementById("dose_analogueL");
var elem_injection_analogueL = document.getElementById("injection_analogueL");
function calcul_mgj14() {
var list_idx = e14.options[e14.selectedIndex].index;
var nb_mg = document.getElementById("dose_analogueL");
var mg = parseFloat(nb_mg.value);
var elem_dose = document.getElementById("injection_analogueL");
var dose = parseFloat(elem_dose.value);
var elem_result = document.getElementById("doseT_analogueL");
if (elem_dose.value != ''){
elem_result.value = parseFloat(mg * dose).toFixed(2);
}
e15.disabled=(list_idx > 0);
elem_dose_analogueM.disabled=(list_idx > 0);
elem_injection_analogueM.disabled=(list_idx > 0);
}
elem_dose_analogueL.addEventListener("blur", calcul_mgj14);
elem_injection_analogueL.addEventListener("blur", calcul_mgj14);
var e15 = document.getElementById("analogueM");
var elem_dose_analogueM =...