VÝPOČET BMI ... V JS PHP

Zadání:
Vytvořte formulář pro výpočet BMI.

K tomuto příkladu budeme potřebovat formulář se dvěma kolonkami, kterému dáme id bmiForm. Prvně vždy vytvoříme HTML div, kterému dáme id. Do divu budeme později vypisovat výstup.

JavaScriptový kód vždy začínáme otevíracím tagem scriptu(<script>), ukončujeme ho uzavíracím tagem scriptu (</script>).

JavaScript prvně prohledá celou stránku pro formulář s id bmiForm díky document.getElementById. Poté díky addEventListener počká, až uživatel zmáčkne tlačítko Vypočti BMI (submit).

Poté vytvoříme konstanty m a v, do kterých vložíme hodnoty z formuláře. Výšku vydělíme 100, aby byla v metrech. Jako další vytvoříme proměnnou zprava, do které vložíme prázdné uvozovky.

Nyní použijeme podmínku if(), kterou zajistíme, že uživatel zadal do formuláře kladnou hodnotu.

Do konstanty bmi vypočítáme BMI pomocí předchozích konstant.

Do konstanty zprava vložíme zaokrouhlené bmi. Ke zprávě později budeme přidávat další vzkazy.

Vytvoříme podmínku if(), která se bude odvíjet od hodnoty BMI. U každé větve podmínky pak přidáme k původní zprávě (za pomoci +=) další text.

Nakonec zprávu vložíme do HTML divu.

<form id="bmiForm">
    Zadej hmotnost v kg:
        <input type="text" id="m" name="m" /><br />

    Zadej výšku v cm:
        <input type="text" id="v" name="v" /><br />

    <input type="submit" value="Vypočti BMI" />
</form>

<div id="bmi-vysledek"></div>

<script>
    document.getElementById("bmiForm").addEventListener("submit", function (e) {
        e.preventDefault();

        const m = Number(document.getElementById("m").value);
        const v = Number(document.getElementById("v").value) / 100;
        let zprava = "";
        if (v <= 0) {
            zprava = "Zadejte prosím kladnou hodnotu!";
            }
        else {
            const bmi = m / (v * v);

            zprava = `<h2>Tvůj BMI = ${bmi.toFixed(2)}</h2>`;

            if (bmi < 20){
                zprava += "Dej si dobrý oběd";
            }
            else if (bmi > 25){
                zprava += "Asi by to chtělo běhat";
            }
            else {
                zprava += "OK";
            }
        }
        document.getElementById("bmi-vysledek").innerHTML = zprava;
    });
</script>