Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> jquery, datepicker - dwa pola wyboru daty datepickere, zawsze działa tylko jedno pole wyboru daty
esos
post 13.11.2013, 08:43:26
Post #1





Grupa: Zarejestrowani
Postów: 48
Pomógł: 0
Dołączył: 7.08.2005
Skąd: zabrze

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

Zamierzam wykorzystać jquery/datepicker w jednym z formularzy.
Podczas zapoznawania się z datepickerem natrafiłem na problem którego nie potrafię przeskoczyć:

Skrypt działa poprawnie, gdy występuje tylko jedno pole z datą, które ma korzystać z datepickera. Gdy pojawi się kolejne - nie uruchamia ono skryptu (klikam w nie - nie pojawia się kalendarzyk).


[HTML] pobierz, plaintext 
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>TEST DATAPICKER</title>
  6. <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  7. <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  8. <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  9.  
  10.  
  11. <script>
  12. $(function() {
  13. $("#datepicker").datepicker({dateFormat: 'yy-mm-dd'});
  14. $('#datepicker').datepicker('option', { firstDay: 1 }); 
  15. $('#datepicker').datepicker('option', { yearRange: '2009:2020' });
  16. $('#datepicker').datepicker('option', { dayNames: ['Niedziela','Poniedzialek','Wtorek','Środa','Czwartek','Piątek','Sobota']});
  17. $('#datepicker').datepicker('option', { monthNames: ['Styczeń','Luty','Marzec','Kwiecień','Maj','Czerwiec', 'Lipiec','Sierpień','Wrzesień','Październik','Listopad','Grudzień']});
  18. $('#datepicker').datepicker('option', { monthNamesShort: ['Sty','Lu','Mar','Kw','Maj','Cze','Lip','Sie','Wrz','Pa','Lis','Gru'] });
  19. $('#datepicker').datepicker('option', { dayNames: ['Niedziela','Poniedzialek','Wtorek','Środa','Czwartek','Piątek','Sobota'] });
  20. $('#datepicker').datepicker('option', { dayNamesShort: ['Nie','Pn','Wt','Śr','Czw','Pt','So'] });
  21. $('#datepicker').datepicker('option', { dayNamesMin: ['N','Pn','Wt','Śr','Cz','Pt','So'] });
  22. $('#datepicker').datepicker('option', { closeText: 'Zamknij' });
  23. $('#datepicker').datepicker('option', { currentText: 'Dziś' });
  24. $('#datepicker').datepicker('option', { prevText: '&#x3c;Poprzedni' });
  25. $('#datepicker').datepicker('option', { nextText: 'Następny&#x3e;' });
  26. });
  27. </script>
  28.  
  29.  
  30.  
  31.  </head>
  32. <body>
  33. <p>data1: <input type="text" id="datepicker" size="30" name='data1'/></p>
  34. <p>data2: <input type="text" id="datepicker" size="30" name='data2'/></p>
  35. </body>
  36. </html>
[HTML] pobierz, plaintext


Jak rozwiązać ten problem?
Go to the top of the page
+Quote Post
nospor
post 13.11.2013, 08:45:02
Post #2





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004
Problem nie ma zadnego zwiazku z AJAX.... przenosze.

ID to ID ma byc UNIKALNE. Czemu to zawsze jest dla was niezrozumiale?


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer
Go to the top of the page
+Quote Post
esos
post 13.11.2013, 08:49:47
Post #3





Grupa: Zarejestrowani
Postów: 48
Pomógł: 0
Dołączył: 7.08.2005
Skąd: zabrze

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

Załapałem gdzie był błąd dosłownie 20 sekund po opublikowaniu posta...

Działający kod:

[HTML] pobierz, plaintext 
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>TEST DATAPICKER</title>
  6. <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  7. <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  8. <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  9.  
  10.  
  11. <script>
  12. $(function() {
  13. $("#datepicker1").datepicker({dateFormat: 'yy-mm-dd'});
  14. $('#datepicker1').datepicker('option', { firstDay: 1 }); 
  15. $('#datepicker1').datepicker('option', { yearRange: '2009:2020' });
  16. $('#datepicker1').datepicker('option', { dayNames: ['Niedziela','Poniedzialek','Wtorek','Środa','Czwartek','Piątek','Sobota']});
  17. $('#datepicker1').datepicker('option', { monthNames: ['Styczeń','Luty','Marzec','Kwiecień','Maj','Czerwiec', 'Lipiec','Sierpień','Wrzesień','Październik','Listopad','Grudzień']});
  18. $('#datepicker1').datepicker('option', { monthNamesShort: ['Sty','Lu','Mar','Kw','Maj','Cze','Lip','Sie','Wrz','Pa','Lis','Gru'] });
  19. $('#datepicker1').datepicker('option', { dayNames: ['Niedziela','Poniedzialek','Wtorek','Środa','Czwartek','Piątek','Sobota'] });
  20. $('#datepicker1').datepicker('option', { dayNamesShort: ['Nie','Pn','Wt','Śr','Czw','Pt','So'] });
  21. $('#datepicker1').datepicker('option', { dayNamesMin: ['N','Pn','Wt','Śr','Cz','Pt','So'] });
  22. $('#datepicker1').datepicker('option', { closeText: 'Zamknij' });
  23. $('#datepicker1').datepicker('option', { currentText: 'Dziś' });
  24. $('#datepicker1').datepicker('option', { prevText: '&#x3c;Poprzedni' });
  25. $('#datepicker1').datepicker('option', { nextText: 'Następny&#x3e;' });
  26. });
  27.  
  28.  
  29. $(function() {
  30. $("#datepicker2").datepicker({dateFormat: 'yy-mm-dd'});
  31. $('#datepicker2').datepicker('option', { firstDay: 1 }); 
  32. $('#datepicker2').datepicker('option', { yearRange: '2009:2020' });
  33. $('#datepicker2').datepicker('option', { dayNames: ['Niedziela','Poniedzialek','Wtorek','Środa','Czwartek','Piątek','Sobota']});
  34. $('#datepicker2').datepicker('option', { monthNames: ['Styczeń','Luty','Marzec','Kwiecień','Maj','Czerwiec', 'Lipiec','Sierpień','Wrzesień','Październik','Listopad','Grudzień']});
  35. $('#datepicker2').datepicker('option', { monthNamesShort: ['Sty','Lu','Mar','Kw','Maj','Cze','Lip','Sie','Wrz','Pa','Lis','Gru'] });
  36. $('#datepicker2').datepicker('option', { dayNames: ['Niedziela','Poniedzialek','Wtorek','Środa','Czwartek','Piątek','Sobota'] });
  37. $('#datepicker2').datepicker('option', { dayNamesShort: ['Nie','Pn','Wt','Śr','Czw','Pt','So'] });
  38. $('#datepicker2').datepicker('option', { dayNamesMin: ['N','Pn','Wt','Śr','Cz','Pt','So'] });
  39. $('#datepicker2').datepicker('option', { closeText: 'Zamknij' });
  40. $('#datepicker2').datepicker('option', { currentText: 'Dziś' });
  41. $('#datepicker2').datepicker('option', { prevText: '&#x3c;Poprzedni' });
  42. $('#datepicker2').datepicker('option', { nextText: 'Następny&#x3e;' });
  43. });
  44. </script>
  45.  
  46.  </head>
  47. <body>
  48. <p>data1: <input type="text" id="datepicker1" size="30" name='data1'/></p>
  49. <p>data2: <input type="text" id="datepicker2" size="30" name='data2'/></p>
  50. </body>
  51. </html>
  52.  
  53.  
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
nospor
post 13.11.2013, 08:57:09
Post #4





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004
Jakbys uzyl klasy, ktora moze byc taka sama dla kazdego elementu, to kod bys mial 2x krotszy


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer
Go to the top of the page
+Quote Post
« Następny starszy · JavaScript · Następny nowszy »
 

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

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 13.06.2025 - 02:44
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn