Zadanie z js i formularzem ',:)

0

Treść:
**Napisać aplikację w JS pozwalającą na obliczenie objętości, pola powierzchni całkowitej oraz długości wszystkich krawędzi prostopadłościanu dla zadanych długości i szerokości podstawy oraz wysokości tego prostopadłościanu.

Dane wejściowe do aplikacji wprowadzić z klawiatury za pośrednictwem pól tekstowych input. Wynik wyświetlić na ekranie, na tej samej stronie WWW, również za pomocą pól tekstowych input.

Wykonać aplikację w dwóch wariantach, w zależności od położenia elementów wejścia/wyjścia. Pola tekstowe input jako elementy wejścia/wyjścia aplikacji.

→ powinny być umieszczone wewnątrz aplikacji HTML (wariant1)
→ powinny być zależne od jakiegokolwiek formularza (warian2)**

No więc mam problem z wypisaniem wartości w input, na razie mam tyle:

<html>
    <head>
        <meta charset="utf-8">
        <title>Obliczanie wartości prostopadłościanu</title>
        <script>
            var x = document.getElementById('x').value;
            var y = document.getElementById('y').value;
            var z = document.getElementById('z').value;

            function objetosc(){
                 if ( isNaN(x) && isNaN(y) && isNaN(z) ){
                    alert("Dane które podałeś, na pewno nie są danymi prostopadłościanu.");
                }
                if(x>0 && y>0 && z>0){
                    document.getElementById("obw2");
                    $('#obw2').value(x*y*z);
                }
            }

           
        </script>
    </head>
    <body>
        <fieldset>
            <legend>Dane prostopadłościanu</legend>
            <form name="Dane">
                <input id="x" type="text" placeholder="Długość" required="required"><br><br>
                <input id="y" type="text" placeholder="Wysokość" required="required"><br><br>
                <input id="z" type="text" placeholder="Szerokość" required="required"><br><br>
                <button title="obw" onclick="objetosc()">Objętość</button>
                <input id="obw2" type="text" value="0" ><br><br>
                <button title="ppp" onclick="polepowierzchni()">Pole powierzchni całkowitej</button>
                <input id="ppp2" type="text" value="0"><br><br>
                <button title="kra" onclick="krawedzie()">Długości wszystkich krawędzi</button>
                <input id="kra2" type="text" value="0"><br><br>
            </fieldset>
        </form>
    </body>
</html>```
1

Po pierwsze

 if ( isNaN(x) && isNaN(y) && isNaN(z) ){

Tutaj chyba ma byc OR a nie AND.

Po drugie

document.getElementById("obw2");
$('#obw2').value(x*y*z);

jQuery przeciez tutaj nie ma. Robisz tez document.getElementById ale nigdzie tego nie przechwytujesz.

Finalnie:
Dokument parsuje sie od gory do dolu. W momencie kiedy parsuje sie skrypt w headzie to te elementy z id "x" "y" "z" nie istnieja. A wiec var x == null, var y == null, var z == null. (wrzuc to do ciala funkcji)

Polecam korzystac z konsoli do debugowania (F12).

1 
<html>
    <head>
        <meta charset="utf-8">
        <title>Obliczanie wartości prostopadłościanu</title>
    </head>
    <body>
        <fieldset>
            <legend>Dane prostopadłościanu</legend>
            <form name="Dane" action="javascript:void(0);">
                <input id="x" type="text" placeholder="Długość" required="required"><br><br>
                <input id="y" type="text" placeholder="Wysokość" required="required"><br><br>
                <input id="z" type="text" placeholder="Szerokość" required="required"><br><br>
                <button id ="objetoscBtn" title="obw">Objętość</button>
                <input id="obw2" type="text" value="0" ><br><br>
                <button title="ppp" onclick="polepowierzchni()">Pole powierzchni całkowitej</button>
                <input id="ppp2" type="text" value="0"><br><br>
                <button title="kra" onclick="krawedzie()">Długości wszystkich krawędzi</button>
                <input id="kra2" type="text" value="0"><br><br>
            </fieldset>
        </form>
        <script>
            function objetosc(){
                const x = document.getElementById('x').value;
                const y = document.getElementById('y').value;
                const z = document.getElementById('z').value;

                if ( isNaN(x) || isNaN(y) || isNaN(z) ){
                    alert("Dane które podałeś, na pewno nie są danymi prostopadłościanu.");
                }
                else if( x > 0 && y > 0 && z > 0) {
                    document.getElementById("obw2").value = x*y*z;
                }
                else {
                    alert("Długości muszą być dodatnie.");
                }
            }

            document.getElementById('objetoscBtn').addEventListener('click', objetosc);
        </script>
    </body>
</html>

W ten sposob zdaje sie dziala. Wylaczylem tez przeladowywanie strony jak klikasz przycisk.

1 użytkowników online, w tym zalogowanych: 0, gości: 1