Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [jQuery][JavaScript] Kalkulator z suwakiem
Forum PHP.pl > Forum > Przedszkole
Kao
Witam
Jestem początkującym w jQuery i mam taki mały problem kod jest mianowicie w fazie rozwoju:
  1. <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />
  2. <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>
  3. <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/tags/1.8rc1/jquery-1.4.1.js"></script>
  4. <script type="text/javascript" src="http://jquery-ui.googlecode.com/svn/tags/1.8rc1/ui/jquery-ui.js"></script>
  5. <style type="text/css">
  6. #kredyt, #ilerat { margin: 10px; }
  7. </style>
  8. <script type="text/javascript">
  9. $(document).ready(
  10. function(){
  11. $("#kredyt").slider({orientation: 'horizontal', min: 1, max: 36, step: 1});
  12.  
  13. $("#kredyt").change(function(event,ui) {
  14. var mypos = $("#kredyt").slider("value");
  15. $("#kredytwartosc").html('mypos');
  16. });
  17.  
  18. $("#ilerat").slider({orientation: 'horizontal', min: 1, max: 36, step: 1});
  19. }
  20. );
  21. </script>
  22.  
  23. Rata: <div id="rata"></div><br>
  24. Kwota Kredytu w tys. zł
  25. <div id="kredyt" style="width: 200px;"></div><div id="kredytwartosc"></div><br>
  26. Liczba rat:
  27. <div id="ilerat" style="width: 200px;"></div><div id="ileratwartosc"></div><br>


Proszę nie zwracać uwagi na CSS bo na razie chodzi o .... właśnie co jest nie tak z pobraniem wartość mypos bo może źle zapisuje do pola div, że nie pokazuje wartości?

Z góry dziękuję
Pozdr.
[Edit]
Poprawiłem w niektórych miejscach (z cudzysłowów do apostrofów).
lord_t
Wpisujesz tam po prostu stringa, wywal te apostrofy w linii 15.
Kao
Wywaliłem, robiłem tak:
  1. $('#kredytwartosc').html('mypos');

i tak:
  1. $('#kredytwartosc').html(mypos);


Niestety nie cyka :< Może slider choć ma ustawione min i max i step, nie zwraca wartości? Nie wiem jak to sprawdzić

Proszę o pomoc
Pozdr.
lord_t
Już wiem w czym błąd. W dokumentacji masz pokazane jak dołączyć zdarzenie change do slidera (1. sposób - ten drugi sposób jakoś nie chciał mi zadziałać).

Kao
Witam
Dzięki wszystko ładnie pięknie chodzi snitch.gif

Pozdr.

Ps.
Faktycznie nie zauważyłem że tu się inaczej używa change snitch.gif

Witam ponownie
Natknąłem się na nowy problem a mianowicie przekazania zmiennych z funkcji na zewnątrz
  1. tabeladanych[$("#kredyt").val()][$("#ilerat").val()]
(chodzi o ratę), proszę o jakąś podpowiedź, a oto kod:
  1. $(document).ready(function() {
  2. var posmiesiac, poskredyt;
  3. var valKredyt = [1000,2000,3000,4000,5000,10000];
  4. var valMiesiace = [12,24,36,48,60,72,84,96];
  5. var tabeladanych = new Array(
  6. [1,1000,2000,3000,4000,5000,10000],
  7. [12, 101, 202, 303, 506, 1012, 0],
  8. [24, 54, 109, 164, 274, 548, 823],
  9. [36, 39, 79, 118, 197, 395, 593],
  10. [48, 32, 64, 96, 160, 320, 480],
  11. [60, 27, 55, 82, 137, 275, 413],
  12. [72, 24, 49, 73, 123, 246, 369],
  13. [4,22,45, 67, 113, 226,339],
  14. [96,21,42,63,105,211,317]);
  15.  
  16. /*
  17.   $.get("dane.csv", function(data){
  18.   tabeladanych = $.csv()(data);
  19.   });
  20.   */
  21.  
  22. $("#kredyt").slider({
  23. min: 0,
  24. max: 5,
  25. step: 1,
  26. change: function(event,ui) {
  27. poskredyt = $("#kredyt").slider("value");
  28. $("#kredytwartosc").html(valKredyt[poskredyt]);
  29. return poskredyt;
  30. }
  31. });
  32.  
  33. $("#ilerat").slider({
  34. min: 0,
  35. max: 7,
  36. step: 1,
  37. change: function(event,ui) {
  38. posmiesiac = $("#ilerat").slider("value");
  39. $("#ileratwartosc").html(valMiesiace[posmiesiac]);
  40. return posmiesiac;
  41. }
  42. });
  43. $("#rata").html("<b>"+tabeladanych[$("#kredyt").val()][$("#ilerat").val()]+"</b>");
  44. });


Ps. Ładowanie z pliku csv zostawiłem sobie na później. snitch.gif
Z góry dziękuję za pomoc
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.