Zmiana ilości PLUS i MINUS z kontrolą bilansu.

0

Szukam rozwiązania problemu. Jestem kiepski w JS więc szukam pomocy.

Mam tabele:

Nazwa Ilość
Typ 1 20
Typ 2 40
Typ 3 60

i teraz chciałbym dodać możliwość zmiany ILOŚĆ za pomocą + i -.

Nazwa Ilość
Typ 1 +20-
Typ 2 +40-
Typ 3 +60-

jednak z możliwością kontroli bilansu (jesli wezmiemy z jednego to mozemy dodać to samo do innego) i jeśli bilans jest inny niż 0 to pojawia się dodatkowy wiersz z bilansem.

Nazwa Ilość
Pozostało 30
---------------- ----------------
Typ 1 +20-
Typ 2 +10-
Typ 3 +60-

No i teraz wiem jak zmienić ilości w danym wierszu, jednak nie wiem jak kontrolować bilans i wyświetlenie wiersza z bilansem.

0

Pokaż co masz zrobione

0

Hej!

Troszkę wczoraj "pogrzebałem" i trochę zmieniłem ale sens ten sam:

<div><a href="#plus" class="up">+</a>
    <div class="licznik">50</div><a href="#minus" class="down">-</a>
</div>
<div><a href="#plus" class="up">+</a>
    <div class="licznik">50</div><a href="#minus" class="down">-</a>
</div>
<div><a href="#plus" class="up">+</a>
    <div class="licznik">50</div><a href="#minus" class="down">-</a>
</div>
<div><a href="#plus" class="up">+</a>
    <div class="licznik">50</div><a href="#minus" class="down">-</a>
</div>
<div><a href="#plus" class="up">+</a>
    <div class="licznik">50</div><a href="#minus" class="down">-</a>
</div>BILANS:
<div class="bilans">0</div> 

teraz JS

$('.up').click(function () {
    var wartosc = $(this).closest('div').children('.licznik');
    var bilans = $('.bilans').text();

    if (bilans > 0) {
        up = parseInt(wartosc.html()) + 10;
        bilans = parseInt(bilans) - 10;
        wartosc.html(up);
    }

    $('.bilans').text(bilans);
});

$('.down').click(function () {
    var wartosc = $(this).closest('div').children('.licznik');
    var bilans = $('.bilans').text();

    if (wartosc.html() > 0) {
        up = parseInt(wartosc.html()) - 10;
        bilans = parseInt(bilans) + 10;
    }
    wartosc.html(up);
    $('.bilans').text(bilans);
});

no i wszystko działa na http://jsfiddle.net/ jednak nie działa u mnie na stronie.

Dodałem jQuery 1.8.3.

I teraz nie mam pojęcia dlaczego nie działa.

0

zajrzyj w konsolę - na pewno tam masz jakiś błąd.

albo zalinkuj do tej Twojej strony, to zbadamy problem

0
Uncaught exception: TypeError: '$' is not a function
Error thrown at line 101, column 0 in http://partnersclub.pl/temp.html:
    $('.up').click(function () {


// oraz to:
[cycle] terminating; too few slides: 0                   jquery.cycle.all.min.js:24
[cycle] terminating; too few slides: 0                   jquery.cycle.all.min.js:24

zaglądaj w konsolę!

poczytaj o document ready w jQuery

0

Niestety zaglądam w konsolę ... jednak nie rozumiem znajdujących się tam błędów.
Wpisuję na StackOverflow itp. ale nadal jestem w czarnej du...

Najbardziej mnie zastanawia dlaczego skrypt działa na http://jsfiddle.net/ bez problemów...

Co do document ready to nie bardzo wiem jak to ugryźć konkretnie do tego skryptu.

$(document).ready(function() {
 
    //tutaj mój skrypt ???
 
})

Czy wywołuję te funkcje w złym miejscu na stronie ??

Czy powinienem wstawić to w HEAD czy w BODY ???

Nie wiem!

0

otocz ten Twój kod tym, co napisałeś w poście wyżej i będzie działać.

ALE !!!!!!!!!!!!!!!!!!!!!!
pierwsze poczytaj DLACZEGO to tak jest. Nie przeklejaj bezmyślnie przykładów, bo nigdy nie nauczysz się programować.

jsfiddle domyślnie otacza Twój kod czymś takim, więc działa.

0
dzek69 napisał(a):

otocz ten Twój kod tym, co napisałeś w poście wyżej i będzie działać.

<script type="text/javascript">
$(document).ready(function() {
 
	$('.up').click(function () {
	    var wartosc = $('.mini12').closest('div').children('.licznik');
	    var bilans = $('.bilans').text();

	    if (bilans > 0) {
		up = parseInt(wartosc.html()) + 10;
		bilans = parseInt(bilans) - 10;
		wartosc.html(up);
	    }

	    $('.bilans').text(bilans);
	});

	$('.down').click(function () {
	    var wartosc = $('.mini12').closest('div').children('.licznik');
	    var bilans = $('.bilans').text();

	    if (wartosc.html() > 0) {
		up = parseInt(wartosc.html()) - 10;
		bilans = parseInt(bilans) + 10;
	    }
	    wartosc.html(up);
	    $('.bilans').text(bilans);
	});

});
</script>

no i nie działa!

0

masz jakieś dziwne jQuery które ustawia tryb noConflict, powodujący, że funkcje jQuery nie są dostępne znakiem dolara, tylko trzeba pisać jQuery(selektor).funkcja()

zamień to na normalne jquery

0

masz jakieś dziwne jQuery które ustawia tryb noConflict, powodujący, że funkcje jQuery nie są dostępne znakiem dolara, tylko trzeba pisać jQuery(selektor).funkcja()
zamień to na normalne jquery

Nie wiem jak zamienić na inne jQuery, ale zamieniłem wszystkie "$" na "jQuery" i działa prawie ....

Widzę, że ma problem z .closest().children(), ponieważ dodaje i odejmuje ale wszystkie wartosci na raz.

Myslisz, że zamiana jQuery rozwiąże ten problem też ?

0

po prostu ściągnąć inne? lol..

nie, nie rozwiąże, bo kod jest zły.

var wartosc = $(this).closest('div').children('.licznik');

nawet nie próbuję tłumaczyć dlaczego, bo ty nie próbujesz nic zrozumieć z kodu to szkoda mojego czasu

0

Już skrypt działa. Drobne poprawki i zadziałał. Problem był z jQuery i kompatybilnością z innymi dodatkami na stronie.

Ale teraz mi wyszedł drugi problem i ... może ktoś ma pomysł.

Muszę teraz te dane zapisać do bazy, ale tylko wtedy gdy bilans równy 0.

Wyciągnięcie danych jeśli będzie pole INPUT spoko. Gorzej w tym przypadku...

Nie nawidzę javascript!!!

Chyba czas na porządną naukę.

1

po prostu zrób sobie hidden inputy i oprócz wpisywania danych w elementy html - ustawiaj value w tych inputach.

pamiętaj też, zeby sprawdzić w php czy faktycznie suma się zgadza - dane od klienta można sfałszować

0

Trochę pozmieniałem kod:

<div><a href="#plus" class="up">+</a> <div class="licznik">50</div>
    <input type="text" name="ban[]" class="licznik" value="50"><a href="#minus" class="down">-</a>
</div>
    
<div><a href="#plus" class="up">+</a> <div class="licznik">50</div>
    <input type="text" name="ban[]" class="licznik" value="50"><a href="#minus" class="down">-</a>
</div>
    
<div><a href="#plus" class="up">+</a> <div class="licznik">50</div>
    <input type="text" name="ban[]" class="licznik" value="50"><a href="#minus" class="down">-</a>
</div>
    
<div><a href="#plus" class="up">+</a>
     <div class="licznik">50</div>
    <input type="text" name="ban[]" class="licznik" value="50"><a href="#minus" class="down">-</a>
</div>
<div><a href="#plus" class="up">+</a> <div class="licznik">50</div>
    <input type="text" name="ban[]" class="licznik" value="50"><a href="#minus" class="down">-</a>
</div>BILANS:
     <div class="bilans">0</div><input type="text" name="bilans" class="licznik" value="0">
$('.up').click(function () {
    var wartosc = $(this).closest('div').children('.licznik');
    var bilans = $('.bilans').text();

    if (bilans > 0) {
        up = parseInt(wartosc.html()) + 10;
        bilans = parseInt(bilans) - 10;
        wartosc.html(up);
**         $(this).closest('input[name*="ban[]"]').val(up);**
    }

    $('.bilans').text(bilans);
    $('input[name$="bilans"]').val(bilans);
});

$('.down').click(function () {
    var wartosc = $(this).closest('div').children('.licznik');
    var bilans = $('.bilans').text();

    if (wartosc.html() > 0) {
        up = parseInt(wartosc.html()) - 10;
        bilans = parseInt(bilans) + 10;
    }
    wartosc.html(up);
**    $(this).closest('input[name*="ban[]"]').val(up);**
    $('.bilans').text(bilans);
    $('input[name$="bilans"]').val(bilans);
});

Oczywiście użyłem na razie INPUT-a TEXT zamiast HIDDEN, żeby zobaczyć czy działa i nie działa.

Wiem, że problem jest w linijkach oznaczonych ** ** ale nie wiem co zmienić.

1

A może być spróbował ZROZUMIEĆ swój kod chociaż raz? Naprawdę.
Ja Ci mogę dać znowu rozwiązanie, ale za 3 dni napiszesz kolejnego posta.

Odpal sobie w dokumentacji jQuery następujące funkcje, poczytaj, korzystaj z narzędzi deweloperskich do wyświetlania ładnego drzewa DOM (bo Twój kod jest sformatowany byle jak i nie da się w nim odnaleźć), pobaw się jak działa każda funkcja:
#closest
#find
#children (i jaka jest różnica od find)
#parent (i jaka jest różnica od closest)
#siblings
#next (i nextAll)
#prev (i prevAll)

0

Dziękuję, wszystko działa!!!!!!
Przepraszam za kłopot!

Biorę się za naukę!

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