Forum PHP.pl > [jQuery] Podliczanie

piotrex41

24.07.2012, 12:09:42

Witam,

Piszę skrypt formularza, który na końcu ma być zliczany (kwota do zapłaty), ale napotkałem 2 problemy:
1. Kiedy wpiszę literę zamiast liczby suma się wywala - zamienia się na NaN
2. Kiedy wpiszę do formularza wartość po raz drugi (inną) to znowu ją dolicza zamiast zamienić.

Oto skrypt:

Kod

$(function($)
{
    var divs = ['#smoczek', '#butelka_smoczek'];
    var suma = 0;
    $('input').keyup(function()
    {
        var value = $(this).val();
        var id = $(this).attr('id');
        var cena = $('div' + divs[id-1] + ' div.item_price strong').text().replace(',', '\.');
        var koszt = parseFloat(cena) * parseFloat(value);
        suma = parseFloat(suma) + parseFloat(koszt.toFixed(2));
        $('div#suma').text(suma.toFixed(2));
    }).keyup();
});

A tu kawałek kodu HTML odpowiedzialny za inputa i cenę:

Kod

<div class="cell price">
    <label for="1">ilość sztuk:</label>
    <input type="text" name="szt1" id="1" maxlength="3" value="0" onkeyup="this.value=this.value.replace(/\D/g,'')" onBlur="if(this.value=='') this.value='0';" onFocus="if(this.value=='0') this.value='';"/>
    <div class="item_price">
        <strong>49,<small>40</small></strong> <span>/ szt.</span>
    </div>
</div>

Ogólna struktura DIVów wygląda mniej więcej tak:

Kod

div.table -> div.img | div.desc | div.price <- /div.table

Proszę o pomoc, wskazówki, rady

nospor

24.07.2012, 12:21:23

ad1) Sprawdzaj co jest wynikiem parseFloat a nie mnożysz od razu....
ad2) Powinienieś za każdym razem zliczać sumę wszystkich inputów a nie aktualnego.

piotrex41

24.07.2012, 12:24:00

Ad2. A jeśli mam tych inputów 20? Ciężko było z wyciąganiem cen, dlatego jest tablica. Wrzucony kawałek kodu to tylko kawałek do testów, ale formularz będzie dłuższy, 15-20 pozycji.

nospor

24.07.2012, 12:25:07

A co za różnica czy 20 czy 2 czy 5? Kod do napisania dokładnie ten sam i ta sama liczba linijek tego kodu.

piotrex41

24.07.2012, 12:27:40

Z jQuery dopiero zaczynam zabawę, więc to pisanie nie idzie mi tak sprawnie, dlatego też nie bardzo wiem jak to napisać żeby miało tyle samo linijek, bez znaczenia ile inputów. Po prostu kombinuję ucząc się, więc jak byś mógł podpowiedzieć coś więcej

AD1 Zrobiłem sprawdzanie czy parseFloat(value) jest liczbą, ew. alert.

Kod

$(function($)
{
    var divs = ['#smoczek', '#butelka_smoczek'];
    var suma = 0;
    $('input').keyup(function()
    {
        var value = $(this).val();
        var id = $(this).attr('id');
        var cena = $('div' + divs[id-1] + ' div.item_price strong').text().replace(',', '\.');
        var koszt = parseFloat(cena) * parseFloat(value);
        if (isNaN(parseFloat(value)))
        {
            alert('należy podać liczbę')
        }
        else
        {
            suma = parseFloat(suma) + parseFloat(koszt.toFixed(2));
        }
        $('div#suma').text(suma.toFixed(2));
    }).keyup();
});

nospor

24.07.2012, 12:31:37

Kod na sumowanie wszystkiego:

Kod

suma = 0;
$('input').each(function()
    {
        var value = $(this).val();
        var id = $(this).attr('id');
        var cena = $('div' + divs[id-1] + ' div.item_price strong').text().replace(',', '\.');
        var koszt = parseFloat(cena) * parseFloat(value);
        suma = parseFloat(suma) + parseFloat(koszt.toFixed(2));

    });
$('div#suma').text(suma.toFixed(2));

I już.

piotrex41

24.07.2012, 12:41:09

Niestety nic nie zlicza

Kod

$(function($)
{
    var divs = ['#smoczek', '#butelka_smoczek'];
    var suma = 0;
    $('input').each(function()
    {
        var value = $(this).val();
        var id = $(this).attr('id');
        var cena = $('div' + divs[id-1] + ' div.item_price strong').text().replace(',', '\.');
        var koszt = parseFloat(cena) * parseFloat(value);
        if (isNaN(parseFloat(value)))
        {
            alert('należy podać liczbę');
        }
        else
        {
            suma = parseFloat(suma) + parseFloat(koszt.toFixed(2));
        }
    });
    $('div#suma').text(suma.toFixed(2));
});

nospor

24.07.2012, 12:58:57

Trudno by ci od razu po odpaleniu strony coś zliczył.... podejrzewam, ze po odpaleniu strony w inputach nic nie masz.

ps: po grzyba ty się bawisz w jakieś divy, parsowanie ich zawartosci.... toż to koszmar jakiś... dodawaj cene jako atrybut inputa i po sprawie

Kod

$(function($)
{
    var suma = 0;
    $('input').each(function()
    {
        var value = $(this).val();
        var id = $(this).attr('id');
        var cena = $(this).attr('cena');
        var koszt = parseFloat(cena) * parseFloat(value);
        if (isNaN(parseFloat(value)))
        {
            alert('należy podać liczbę');
        }
        else
        {
            suma = parseFloat(suma) + parseFloat(koszt.toFixed(2));
        }
    });
    $('div#suma').text(suma.toFixed(2));
});

piotrex41

24.07.2012, 12:59:17

No ok, ale jak dam tak, to znowu sumuje nawet jak zmienię wartość, to tylko dolicza.

Kod

$(function($)
{
    var divs = ['#smoczek', '#butelka_smoczek'];
    var suma = 0;
    $('input').keyup(function()
    {
        $('input').each(function()
        {
            var value = $(this).val();
            var id = $(this).attr('id');
            var cena = $('div' + divs[id-1] + ' div.item_price strong').text().replace(',', '\.');
            var koszt = parseFloat(cena) * parseFloat(value);
            if (isNaN(parseFloat(value)))
            {
                alert('należy podać liczbę');
            }
            else
            {
                suma = parseFloat(suma) + parseFloat(koszt.toFixed(2));
            }
        });
        $('div#suma').text(suma.toFixed(2));
    });
});

nospor

24.07.2012, 13:00:33

No ale przed sumowaniem masz zerować sume.... a ty sume zerujesz raz na początku...

piotrex41

24.07.2012, 13:03:04

No i teraz działa

Jakie to człowiek głupie rzeczy robi jak siedzi nad czymś 3-4h

Dziękuję za pomoc i cierpliwość

Kod

$(function($)
{
    var divs = ['#smoczek', '#butelka_smoczek'];
    $('input').keyup(function()
    {
        var suma = 0;
        $('input').each(function()
        {
            var value = $(this).val();
            var id = $(this).attr('id');
            var cena = $('div' + divs[id-1] + ' div.item_price strong').text().replace(',', '\.');
            var koszt = parseFloat(cena) * parseFloat(value);
            if (isNaN(parseFloat(value)))
            {
                alert('należy podać liczbę');
            }
            else
            {
                suma = parseFloat(suma) + parseFloat(koszt.toFixed(2));
            }
        });
        $('div#suma').text(suma.toFixed(2));
    });
});