Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript][AJAX][PHP]Automatyczne wypełnianie diva danymi
Forum PHP.pl > Forum > Przedszkole
nikestylex7
4.04.2013, 03:25:57
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.
markonix
4.04.2013, 10:11:25
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.
bpskiba
4.04.2013, 10:48:21 
[HTML] pobierz, plaintext 
  1. <html><head>
  2. <script type="text/javascript">
  3. var k=0;
  4. function dodaj(ile)
  5.   {
  6.   var e=document.getElementById("w");
  7.   k=k+ile; 
  8.   e.innerHTML=k;
  9.   }
  10. </script></head><body>
  11. klikaj w poniższe liczby<br>
  12. <div onclick="dodaj(1)">1</div>
  13. <div onclick="dodaj(2)">2</div>
  14. <div onclick="dodaj(3)">3</div>
  15. <br><br><br>
  16. wynik<br>
  17. <div id="w">0</div>
  18. </body></html>
[HTML] pobierz, plaintext
nikestylex7
4.04.2013, 11: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?
bpskiba
4.04.2013, 12:34:01
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ś.
nikestylex7
4.04.2013, 12:55:44
zmienia mi zawartość lecz gdy klikne jeden i dwa to ich nie dodaje tylko zmienia z 1 na 2

[PHP] pobierz, plaintext 
  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>
[PHP] pobierz, plaintext
markonix
4.04.2013, 13: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.

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

Pytaniem czemu k wynosi tyle ile "ile"? Odpowiedź chyba oczywista.
bpskiba
4.04.2013, 15:11:33
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
nikestylex7
4.04.2013, 19:03:50
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 

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


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.

[PHP] pobierz, plaintext 
  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>
[PHP] pobierz, plaintext
markonix
4.04.2013, 20:06:33
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.
nikestylex7
4.04.2013, 20:29:11
zrozumiałem ale nie wszystko wyszło mi coś takigo 
[PHP] pobierz, plaintext 
  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>
[PHP] pobierz, plaintext


licby chcialbym zeby mi z diva pobieralo
markonix
4.04.2013, 20:50:26
Bezmyślnie kopiujesz kod, zero zrozumienia javasciriptu.
[PHP] pobierz, plaintext 
  1. $(this).attr('"<div data-value="<?= 2.00 ?>"><?= 3.8 ?></div>');
[PHP] pobierz, plaintext

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.

[PHP] pobierz, plaintext 
  1. <?= 2.00 ?>
[PHP] pobierz, plaintext
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ć.
nikestylex7
4.04.2013, 23:42:30
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

?
PrinceOfPersia
5.04.2013, 01:18:21
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ć.

costad
5.04.2013, 13:18:32
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
-nikestylex7-
5.04.2013, 16:31:45
Nie wiem jak zmienić żeby zamiast zamieniać liczby czyli klikne 1 bedzie jeden klikne dwa bedzie dwa dodawał mi je 1+2 = 3 

[PHP] pobierz, plaintext 
  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>
[PHP] pobierz, plaintext
nikestylex7
5.04.2013, 17:37:24
niby powinno dodawac i umieszczac w divie id w ale tak nie jest

co jest tutaj nie tak 

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


wyswietla [object HTMLDivElement]3 gdzie 3 to ile a ten blad to zmienna ko no ale przeciez dobrze jest napisane
bpskiba
6.04.2013, 21:31:05
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 

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


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
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.
Invision Power Board © 2001-2025 Invision Power Services, Inc.