Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript][AJAX][PHP]Automatyczne wypełnianie diva danymi
nikestylex7
post 4.04.2013, 03:25:57
Post #1





Grupa: Zarejestrowani
Postów: 386
Pomógł: 7
Dołączył: 22.04.2010
Skąd: Ziemia

Ostrzeżenie: (20%)
X----


Witam. Z tego względu, że z js jestem noga proszę o pomoc czy jest możliwość zrobienia tego czego chce.
Tutaj pokaże na czym będziemy bazować.


Mamy tutaj prosty kalkulator. Po kliknięciu na liczbe powinna ona się dodać z prawej strony. Powinien uzupełnić się kurs. Po wpisaniu stawki powinno się przemnożyć i podać wygraną. Powinno też przy dodaniu więcej liczb przemnażać je.

Moja prośba teraz do kogoś kto zna js czy by mi pomógł. Jakiś przykład może. Pozdrawiam.

Ten post edytował nikestylex7 4.04.2013, 12:01:29
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 17)
markonix
post 4.04.2013, 10:11:25
Post #2





Grupa: Zarejestrowani
Postów: 2 707
Pomógł: 290
Dołączył: 16.12.2008
Skąd: Śląsk

Ostrzeżenie: (0%)
-----


Jquery -> click event.
Kurs przechowujesz w dowolnym atrybucie, pobierasz go przez attr (ciągle jQuery).
Do inputów wstawiasz wartości przez val().
I to chyba na tyle, samą kwestie liczenia chyba już dasz radę.

Nie ma to nic wspólnego z Javą, popraw ten temat.

Ten post edytował markonix 4.04.2013, 10:11:40


--------------------
Go to the top of the page
+Quote Post
bpskiba
post 4.04.2013, 10:48:21
Post #3





Grupa: Zarejestrowani
Postów: 340
Pomógł: 49
Dołączył: 3.07.2009
Skąd: Rzeszów

Ostrzeżenie: (0%)
-----


  1. <script type="text/javascript">
  2. var k=0;
  3. function dodaj(ile)
  4. {
  5. var e=document.getElementById("w");
  6. k=k+ile;
  7. e.innerHTML=k;
  8. }
  9. klikaj w poniższe liczby<br>
  10. <div onclick="dodaj(1)">1</div>
  11. <div onclick="dodaj(2)">2</div>
  12. <div onclick="dodaj(3)">3</div>
  13. <br><br><br>
  14. wynik<br>
  15. <div id="w">0</div>
  16. </body></html>
Go to the top of the page
+Quote Post
nikestylex7
post 4.04.2013, 11:33:50
Post #4





Grupa: Zarejestrowani
Postów: 386
Pomógł: 7
Dołączył: 22.04.2010
Skąd: Ziemia

Ostrzeżenie: (20%)
X----


A jak do tego zrobić żeby po tym jak już się raz kliknie to drugi usuwa to co się kliknęło czyli wraca do punktu wyjścia i tekst gdy bedzie puste to pole i napis na początku nie wybrałeś liczby?

Ten post edytował nikestylex7 4.04.2013, 12:10:07
Go to the top of the page
+Quote Post
bpskiba
post 4.04.2013, 12:34:01
Post #5





Grupa: Zarejestrowani
Postów: 340
Pomógł: 49
Dołączył: 3.07.2009
Skąd: Rzeszów

Ostrzeżenie: (0%)
-----


Cytat(nikestylex7 @ 4.04.2013, 12:33:50 ) *
A jak do tego zrobić żeby po tym jak już się raz kliknie to drugi usuwa to co się kliknęło czyli wraca do punktu wyjścia i tekst gdy bedzie puste to pole i napis na początku nie wybrałeś liczby?


Przyjacielu....
Pomagamy tutaj ludziom zaczynającym przygodę z php, a nie dostarczamy gotowych rozwiązań. Prosiłeś o przykład, więc dostałeś, ale gotowego rozwiązania nie oczekuj.
Poproszę również o przetłumaczenie powyższego posta na język polski, gdyż chińskiego nie rozumiem businesssmiley.png
Teraz pokaż, co Ty napisałeś.
Go to the top of the page
+Quote Post
nikestylex7
post 4.04.2013, 12:55:44
Post #6





Grupa: Zarejestrowani
Postów: 386
Pomógł: 7
Dołączył: 22.04.2010
Skąd: Ziemia

Ostrzeżenie: (20%)
X----


zmienia mi zawartość lecz gdy klikne jeden i dwa to ich nie dodaje tylko zmienia z 1 na 2

  1. <html><head>
  2. <script type="text/javascript">
  3. function dodaj(ile)
  4. {
  5. var k=0;
  6. var e=document.getElementById("w");
  7. k=k+ile;
  8. e.innerHTML=k;
  9. }
  10. function usun(liczba)
  11. {
  12. var ko=document.getElementById("w");
  13. k=ko.innerHTML-liczba;
  14. ko.innerHTML=k;
  15. }
  16. </script></head><body>
  17. klikaj w poniższe liczby<br>
  18. <div onclick="dodaj(1)" onDblClick="usun(1)">1</div>
  19. <div onclick="dodaj(2)" onDblClick="usun(2)">2</div>
  20. <div onclick="dodaj(3)" onDblClick="usun(3)">3</div>
  21. <br><br><br>
  22. wynik<br>
  23. <div id="w">0</div>
  24. </body></html>


Ten post edytował nikestylex7 4.04.2013, 13:35:49
Go to the top of the page
+Quote Post
markonix
post 4.04.2013, 13:55:43
Post #7





Grupa: Zarejestrowani
Postów: 2 707
Pomógł: 290
Dołączył: 16.12.2008
Skąd: Śląsk

Ostrzeżenie: (0%)
-----


Ja Ci polecam sposób z jQuery który krok po kroku Ci przedstawiłem - wyjdzie ładniejszy kod i bardziej odseparowany od HTML.

Co do Twojego problemu.
  1. var k = 0;
  2. [...]
  3. k = k +ile;

Pytaniem czemu k wynosi tyle ile "ile"? Odpowiedź chyba oczywista.


--------------------
Go to the top of the page
+Quote Post
bpskiba
post 4.04.2013, 15:11:33
Post #8





Grupa: Zarejestrowani
Postów: 340
Pomógł: 49
Dołączył: 3.07.2009
Skąd: Rzeszów

Ostrzeżenie: (0%)
-----


Cytat(markonix @ 4.04.2013, 14:55:43 ) *
Ja Ci polecam sposób z jQuery który krok po kroku Ci przedstawiłem - wyjdzie ładniejszy kod i bardziej odseparowany od HTML.


ooooooooooo przyjacielu!!!!!
gdybyśmy się spotkali przy piwie nasza dyskusja nie miała by końca aarambo.gif

Ten post edytował bpskiba 4.04.2013, 17:18:52
Go to the top of the page
+Quote Post
nikestylex7
post 4.04.2013, 19:03:50
Post #9





Grupa: Zarejestrowani
Postów: 386
Pomógł: 7
Dołączył: 22.04.2010
Skąd: Ziemia

Ostrzeżenie: (20%)
X----


markonix już dwie godziny siedzę i analizuje to co napisałeś szukam na internecie jakoś żeby zacząć i nic nie wiem jak mam się za to wziąć jednak to nie to samo co php. Mógłbyś jakoś pomóc?

na razie doszedlem do tego

  1. <script type="text/javascript">
  2. $( document ).ready(function() {
  3. $("#kurs1").click(function() {
  4. tutaj nie wiem co dalej
  5. });
  6. });
  7. </script>


niestety caly dzien siedze i nic nie rozumiem prosilbym o jakas baze przyklad

?

skiba przerobiłem trochę Twój przykład to co miałem na myśli działa nie całkiem dobrze gdyż nie dodaje mi do siebie liczb. Zrobiłem za to podwójne kliknięcie usuwa daną liczbe.

  1. <html><head>
  2. <script type="text/javascript">
  3. var k=0;
  4. function dodaj(ile)
  5. {
  6. var e=document.getElementById("w");
  7. kl=k+ile;
  8. e.innerHTML=kl;
  9. }
  10. function usun(liczba)
  11. {
  12. var ko=document.getElementById("w");
  13. l=ko.innerHTML-liczba;
  14. ko.innerHTML=l;
  15. }
  16. </script></head><body>
  17. klikaj w poniższe liczby<br>
  18. <div onclick="dodaj(1)" onDblClick="usun(1)">1</div>
  19. <div onclick="dodaj(2)" onDblClick="usun(2)">2</div>
  20. <div onclick="dodaj(3)" onDblClick="usun(3)">3</div>
  21. <br><br><br>
  22. wynik<br>
  23. <div id="w">0</div>
  24. </body></html>


Ten post edytował nikestylex7 4.04.2013, 18:08:28
Go to the top of the page
+Quote Post
markonix
post 4.04.2013, 20:06:33
Post #10





Grupa: Zarejestrowani
Postów: 2 707
Pomógł: 290
Dołączył: 16.12.2008
Skąd: Śląsk

Ostrzeżenie: (0%)
-----


Event klik przypnij to wszystkich divów a nie tylko do id="kurs1", ID może być jedno, a divów jest kilka.
Jeżeli masz już odebrany klik to pobierz wartość za pomocą $(this).attr('tu_nazwa_atrybutu').
Nazwa atrybutu dowolna ale poprawnie będzie nazwać np. "<div data-value="<?= tu wstawiasz liczbę z bazy jak się domyślam ?>"><?= tu znowu liczba ?></div>
(można by się pokusić o pobieranie zawartości div'a a nie wartości atrybutu, ale ma to tę zaletę że liczba wyświetlana może w innym formacie np. z przecinkiem.

Ten post edytował markonix 4.04.2013, 20:07:12


--------------------
Go to the top of the page
+Quote Post
nikestylex7
post 4.04.2013, 20:29:11
Post #11





Grupa: Zarejestrowani
Postów: 386
Pomógł: 7
Dołączył: 22.04.2010
Skąd: Ziemia

Ostrzeżenie: (20%)
X----


zrozumiałem ale nie wszystko wyszło mi coś takigo
  1. <script type="text/javascript">
  2. $( document ).ready(function() {
  3. $("div").click(function() {
  4. $(this).attr('"<div data-value="<?= 2.00 ?>"><?= 3.8 ?></div>');
  5. });
  6. });
  7. </script>


licby chcialbym zeby mi z diva pobieralo
Go to the top of the page
+Quote Post
markonix
post 4.04.2013, 20:50:26
Post #12





Grupa: Zarejestrowani
Postów: 2 707
Pomógł: 290
Dołączył: 16.12.2008
Skąd: Śląsk

Ostrzeżenie: (0%)
-----


Bezmyślnie kopiujesz kod, zero zrozumienia javasciriptu.
  1. $(this).attr('"<div data-value="<?= 2.00 ?>"><?= 3.8 ?></div>');

co to ma być? Ja Ci pokazałem jak przekazać z HTMLa (z PHP) do JavaScriptu. a Ty wklejasz kod HTML do argumentu funkcji attr.

  1. <?= 2.00 ?>
a to niby co? Skoro umiesz PHP to co to ma byćquestionmark.gif
Dałem to w echo bo myślałem, że ta tabelka generowana jest z bazy.
Jeśli to sam HTML to warto o tym poinformować.

Ten post edytował markonix 4.04.2013, 20:51:08


--------------------
Go to the top of the page
+Quote Post
nikestylex7
post 4.04.2013, 23:42:30
Post #13





Grupa: Zarejestrowani
Postów: 386
Pomógł: 7
Dołączył: 22.04.2010
Skąd: Ziemia

Ostrzeżenie: (20%)
X----


bardzo przepraszam dawno porzuciłem ten zawód ale chciałbym skończyć stronę którą kiedyś zacząłem. Z js jq jestem noga. Liczby mogą być z bazy w echo lub na sztywno z tym to sobie poradze lecz nie potrafie się odnaleźć aktualnie.

może ktoś byłby w stanie mi pomóc

?
Go to the top of the page
+Quote Post
PrinceOfPersia
post 5.04.2013, 01:18:21
Post #14





Grupa: Zarejestrowani
Postów: 717
Pomógł: 120
Dołączył: 18.04.2009

Ostrzeżenie: (0%)
-----


Cytat
markonix już dwie godziny siedzę i analizuje to co napisałeś szukam na internecie jakoś żeby zacząć i nic nie wiem jak mam się za to wziąć jednak to nie to samo co php.


Cytat
Z js jq jestem noga.

to masz dwa wyjścia - albo pouczyć się JS i jQuery od samych podstaw. albo po prostu wynająć kogoś i zapłacić mu za zrobienie czegoś, czego nie jesteś w stanie sam zrobić.



--------------------
Go to the top of the page
+Quote Post
-costad-
post 5.04.2013, 13:18:32
Post #15





Goście







Chętnie bym Ci pomógł bo mam ten sam problem ale też się nie znam możemy jedynie czekać na jakiś przykład może ktoś pomoże
Go to the top of the page
+Quote Post
--nikestylex7--
post 5.04.2013, 16:31:45
Post #16





Goście







Nie wiem jak zmienić żeby zamiast zamieniać liczby czyli klikne 1 bedzie jeden klikne dwa bedzie dwa dodawał mi je 1+2 = 3

  1. <html><head>
  2. <script type="text/javascript">
  3. k=0;
  4. function dodaj(ile)
  5. {
  6. var e=document.getElementById("w");
  7. kl=k+ile;
  8. e.innerHTML=kl;
  9. }
  10. function usun(liczba)
  11. {
  12. var ko=document.getElementById("w");
  13. l=ko.innerHTML-liczba;
  14. ko.innerHTML=l;
  15. }
  16. </script></head><body>
  17. klikaj w poniższe liczby<br>
  18. <div onclick="dodaj(1)" onDblClick="usun(1)">1</div>
  19. <div onclick="dodaj(2)" onDblClick="usun(2)">2</div>
  20. <div onclick="dodaj(3)" onDblClick="usun(3)">3</div>
  21. <br><br><br>
  22. wynik<br>
  23. <div id="w">0</div>
  24. </body></html>
Go to the top of the page
+Quote Post
nikestylex7
post 5.04.2013, 17:37:24
Post #17





Grupa: Zarejestrowani
Postów: 386
Pomógł: 7
Dołączył: 22.04.2010
Skąd: Ziemia

Ostrzeżenie: (20%)
X----


niby powinno dodawac i umieszczac w divie id w ale tak nie jest

co jest tutaj nie tak

  1. function dodaj(ile)
  2. {
  3. var ko=document.getElementById("w");
  4. l=ko+ile;
  5. ko.innerHTML=l;
  6. }


wyswietla [object HTMLDivElement]3 gdzie 3 to ile a ten blad to zmienna ko no ale przeciez dobrze jest napisane

Ten post edytował nikestylex7 5.04.2013, 17:39:07
Go to the top of the page
+Quote Post
bpskiba
post 6.04.2013, 21:31:05
Post #18





Grupa: Zarejestrowani
Postów: 340
Pomógł: 49
Dołączył: 3.07.2009
Skąd: Rzeszów

Ostrzeżenie: (0%)
-----


Cytat(nikestylex7 @ 5.04.2013, 18:37:24 ) *
niby powinno dodawac i umieszczac w divie id w ale tak nie jest

co jest tutaj nie tak

  1. function dodaj(ile)
  2. {
  3. var ko=document.getElementById("w");
  4. l=ko+ile;
  5. ko.innerHTML=l;
  6. }


wyswietla [object HTMLDivElement]3 gdzie 3 to ile a ten blad to zmienna ko no ale przeciez dobrze jest napisane


Nie!
Jest źle napisane.
Musisz rozumieć czym jest obiekt i co to jest nnerHTML
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 14.08.2025 - 05:40