Forum PHP.pl > [JavaScript]Wywołanie funkcji

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [JavaScript]Wywołanie funkcji

krzesik

13.01.2025, 18:07:46

Witam,
mam poprawnie działającą funkcję przeliczającą mi wartości w komórkach:

[HTML] pobierz, plaintext 
function licz1(a){
a.Plan100.value=(a.Ilosc100.value)*(a.Kwota100.value)
a.Plan50.value=(a.Ilosc50.value)*(a.Kwota50.value)
a.Plan25.value=(a.Ilosc25.value)*(a.Kwota25.value)
}
</script>
[HTML] pobierz, plaintext

przeliczanie działa poprawnie jak opuszczę komórkę:

[HTML] pobierz, plaintext 
<input class="form-control col-xs-1" size="1" name="Kwota100"      value="<? echo $KwotaPelna; ?>"      type="text" onkeyup="licz1(this.form)"></input>
[HTML] pobierz, plaintext

niestety nie zlicz mi na bieżąco po wejściu do formularza, ani gdy kwota się zmienia, jak to wywołać?
Próbowałem poprzez
<body onload="licz1(a)">
ale bez efektu....

trueblue

14.01.2025, 07:23:24

A jest gdzieś zdefiniowana zmienna "a", że przekazujesz ją jako argument do funkcji licz1 w zdarzeniu onLoad dla <body>? Jestem pewien, że nie.

Swoją drogą, skoro do pól Ilość oraz Kwota "wpisujesz" wartości poprzez PHP, to dlaczego nie możesz "wpisać" również poprzez PHP wartości do pól Plan?

Michur

14.01.2025, 10:47:07

Moim zdaniem łatwiej to zrobić samym js, niż rozdzielać to na funkcje wstawione w HTML.
Osobiście zrobiłbym to trochę inaczej, no ale poniżej rozwiązuję Twój problem

[HTML] pobierz, plaintext 
<!DOCTYPE html>
<html>
    <head>
        <script>
            window.onload = () => {
 
                var a = document.querySelector('form');
 
                function licz() {
 
                    a.Plan100.value=(a.Ilosc100.value)*(a.Kwota100.value)
                    a.Plan50.value=(a.Ilosc50.value)*(a.Kwota50.value)
                    a.Plan25.value=(a.Ilosc25.value)*(a.Kwota25.value)
 
                }
 
                var inputs = a.querySelectorAll('input');
                inputs.forEach((input) => {
                    if(input.classList.contains('kwota')) {
                        input.addEventListener('input', licz, false);
                    }
                });
 
                licz();
 
            }
        </script>
    </head>
    <body>
        <form id="form">
            <input type="text" name="Plan100" class="plan" value="">
            <input type="text" name="Ilosc100" class="ilosc" value="12">
            <input type="text" name="Kwota100" class="kwota" value="100">
 
            <input type="text" name="Plan50" class="plan" value="">
            <input type="text" name="Ilosc50" class="ilosc" value="12">
            <input type="text" name="Kwota50" class="kwota" value="50">
 
            <input type="text" name="Plan25" class="plan" value="">
            <input type="text" name="Ilosc25" class="ilosc" value="12">
            <input type="text" name="Kwota25" class="kwota" value="25">
        </form>
    </body>
</html>
[HTML] pobierz, plaintext

trueblue

14.01.2025, 16:48:05

Dużo sprawniejsze byłoby rozwiązanie z delegacją zdarzeń i rozpoznawanie elementów na podstawie ich klas czy atrybutów id, dzięki któremu nie musimy się martwić w przypadku dodawania kolejnych inputów.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.