Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] jQuery wartości zaznaczonych checkbox.
Forum PHP.pl > Forum > Przedszkole
arzach
16.07.2009, 10:50:33
Napisałem taki kod
[HTML] pobierz, plaintext 
  1. <script>
  2. $(document).ready(function() {
  3. $("input[name='test']").click(function() {
  4. if($(this).attr('checked')){
  5. $('#wynik').html('Wybrales <br>' + $(this).val());
  6. }
  7. });  
  8. });
  9. </script>
  10.  
  11. </head>
  12. <body>
  13. <div id="wynik"></div>
  14. <input type="checkbox" name="test[]" value="wartosc 1" />wartosc 1 
  15. <input type="checkbox" name="test[]" value="wartosc 2" />wartosc 2
  16. <input type="checkbox" name="test[]" value="wartosc 3" />wartosc 3
  17. <input type="checkbox" name="test[]" value="wartosc 4" />wartosc 4
[HTML] pobierz, plaintext



Jak mogę zrobić aby pojawiały się wszystkie zaznaczone wartości a nie tylko jedna ?
Fifi209
16.07.2009, 10:57:07
Jak masz te same name na inputach to się nie dziw.
arzach
16.07.2009, 11:00:11
Chodzi i pobranie tych wartości z tablicy test.
Fifi209
16.07.2009, 11:03:32
Cytat(arzach @ 16.07.2009, 11:00:11 ) *
Chodzi i pobranie tych wartości z tablicy test.


To Ci tłumaczę albo wrzuć to do tablicy o tak:

[HTML] pobierz, plaintext 
  1. <input type="checkbox" name="test[]" value="wartosc 1" />wartosc 1
  2. <input type="checkbox" name="test[]" value="wartosc 2" />wartosc 2
  3. <input type="checkbox" name="test[]" value="wartosc 3" />wartosc 3
  4. <input type="checkbox" name="test[]" value="wartosc 4" />wartosc 4
[HTML] pobierz, plaintext


Albo zrób tak:
[HTML] pobierz, plaintext 
  1. <input type="checkbox" name="test1" value="wartosc 1" />wartosc 1
  2. <input type="checkbox" name="test2" value="wartosc 2" />wartosc 2
  3. <input type="checkbox" name="test3" value="wartosc 3" />wartosc 3
  4. <input type="checkbox" name="test4" value="wartosc 4" />wartosc 4
[HTML] pobierz, plaintext


Nie może być takich samych name/id w dokumencie.
arzach
16.07.2009, 11:06:03
Zrobiłem tak ?
[HTML] pobierz, plaintext 
  1. <script>
  2. $(document).ready(function() {
  3. $("input[name='test']").click(function() {
  4. if($(this).attr('checked')){
  5. $(this).each( function(){
  6. wynik += $(this).val() + '<br>';
  7. });
  8. $('#wynik').html('Wybrales <br>' + wynik);
  9. }
  10. });  
  11. });
  12. </script>
[HTML] pobierz, plaintext

I czemu nie działa ?
Fifi209
16.07.2009, 11:10:42
Cytat(arzach @ 16.07.2009, 11:06:03 ) *
Zrobiłem tak ?
[HTML] pobierz, plaintext 
  1. <script>
  2. $(document).ready(function() {
  3. $("input[name='test']").click(function() {
  4. if($(this).attr('checked')){
  5. $(this).each( function(){
  6. wynik += $(this).val() + '<br>';
  7. });
  8. $('#wynik').html('Wybrales <br>' + wynik);
  9. }
  10. });  
  11. });
  12. </script>
[HTML] pobierz, plaintext

I czemu nie działa ?


Pokaż do tego html'a.
arzach
16.07.2009, 11:29:47 
[HTML] pobierz, plaintext 
  1. <script>
  2. $(document).ready(function() {
  3. $("input[name='test']").click(function() {
  4. if($(this).attr('checked')){
  5. $(this).each( function(){
  6. wynik += $(this).val() + '<br>';
  7. });
  8. $('#wynik').html('Wybrales <br>' + wynik);
  9. }
  10. });  
  11. });
  12. </script>
  13.  
  14. </head>
  15. <body>
  16. <div id="wynik"></div>
  17. <input type="checkbox" name="test[]" value="samochod" />samochod 
  18. <input type="checkbox" name="test[]" value="dom" />dom
  19. <input type="checkbox" name="test[]" value="bizuteria" />bizuteria
  20. <input type="checkbox" name="test[]" value="zwierzeta" />zwierzeta
[HTML] pobierz, plaintext



Wydaje mi się że tutaj jest źle powinno być odwołanie do tablicy ?
[HTML] pobierz, plaintext 
  1. $("input[name='test']").click(function() {
[HTML] pobierz, plaintext


?
erix
16.07.2009, 11:33:47
Ale Wy kombinujecie... tongue.gif Przecież jest jasno w dokumentacji napisane, co robić, jeśli w nazwie są symbole "tablicujące":
Kod
$('input[name=test\[\]]')
arzach
16.07.2009, 11:42:54
Teraz jak dam tak 
[HTML] pobierz, plaintext 
  1. <script>
  2. $(document).ready(function() {
  3. $('input[name=test\[\]]').click(function() {
  4. if($(this).attr('checked')){
  5. alert('test');
  6. }
  7. });  
  8. });
  9. </script>
  10.  
  11. </head>
  12. <body>
  13. <div id="wynik"></div>
  14. <input type="checkbox" name="test[]" value="samochod" />samochod 
  15. <input type="checkbox" name="test[]" value="dom" />dom
  16. <input type="checkbox" name="test[]" value="bizuteria" />bizuteria
  17. <input type="checkbox" name="test[]" value="zwierzeta" />zwierzeta
[HTML] pobierz, plaintext

to działa ale jak chce wyświetlić wartości i robie tak 
[HTML] pobierz, plaintext 
  1. <script>
  2. $(document).ready(function() {
  3. $('input[name=test\[\]]').click(function() {
  4. if($(this).attr('checked')){
  5. $(this).each( function(){
  6. wynik += $(this).val() + '<br>';
  7. });
  8. $('#wynik').html('Wybrales <br>' + wynik);
  9. }
  10. });  
  11. });
  12. </script>
  13.  
  14. </head>
  15. <body>
  16. <div id="wynik"></div>
  17. <input type="checkbox" name="test[]" value="samochod" />samochod 
  18. <input type="checkbox" name="test[]" value="dom" />dom
  19. <input type="checkbox" name="test[]" value="bizuteria" />bizuteria
  20. <input type="checkbox" name="test[]" value="zwierzeta" />zwierzeta
[HTML] pobierz, plaintext

to już nie działa. Co może być tego powodem ?
erix
16.07.2009, 11:45:17
Kod
$(this).each( function(){
wynik += $(this).val() + '<br>';
});

this w kontekście zdarzenia zawiera tylko jeden element. Pogłówkuj. [;
arzach
16.07.2009, 11:54:01
Cytat(erix @ 16.07.2009, 12:45:17 ) *
Kod
$(this).each( function(){<BR>wynik += $(this).val() + '<BR>';<BR>});

this w kontekście zdarzenia zawiera tylko jeden element. Pogłówkuj. [;


No już prawie działa.
Zrobiłem tak

[HTML] pobierz, plaintext 
  1. <script>
  2. $(document).ready(function() {
  3. $('input[name=test\[\]]').click(function() {
  4. if($(this).attr('checked')){
  5. var wynik;  
  6. $('input[name=test]').each( function(){
  7. wynik += $(this).val() + '<br>';
  8. });
  9. $('#wynik').html('Wybrales <br>' + wynik);
  10. }
  11. }); 
  12. });
  13. </script>
  14.  
  15.  
  16. </head>
  17. <body>
  18. <div id="wynik"></div>
  19. <input type="checkbox" name="test[]" value="samochod" />samochod 
  20. <input type="checkbox" name="test[]" value="dom" />dom
  21. <input type="checkbox" name="test[]" value="bizuteria" />bizuteria
  22. <input type="checkbox" name="test[]" value="zwierzeta" />zwierzeta
[HTML] pobierz, plaintext


I pojawia się
Wybrales
undefined

Może ktoś pomóc co jest źle ?
erix
16.07.2009, 11:57:18
Znowu zrobiłeś ten sam błąd... ;/

Poza tym, po co wyszukujesz elementy dwa razy?
arzach
16.07.2009, 12:45:13
Cytat(erix @ 16.07.2009, 12:57:18 ) *
Poza tym, po co wyszukujesz elementy dwa razy?


Można prosić jaśniej ?

Zrobiłem tak 
[HTML] pobierz, plaintext 
  1. <script>
  2. $(document).ready(function() {
  3. $('input[name=test\[\]]').click(function() {
  4. var wynik;  
  5. $('input[name=test\[\]]:checked').each( function(){
  6. wynik += $(this).val() + '<br>';
  7. });
  8. $('#wynik').html('Wybrales <br>' + wynik);
  9. }); 
  10. });
  11. </script>
  12.  
  13.  
  14. </head>
  15. <body>
  16. <div id="wynik"></div>
  17. <input type="checkbox" name="test[]" value="samochod" />samochod 
  18. <input type="checkbox" name="test[]" value="dom" />dom
  19. <input type="checkbox" name="test[]" value="bizuteria" />bizuteria
  20. <input type="checkbox" name="test[]" value="zwierzeta" />zwierzeta
[HTML] pobierz, plaintext

i już prawie działa bo wyświetla wartości ale za każdym razem wyświetla na początku undefined

Przykład działa i błędu można zobaczyć na http://www.fusion.boo.pl/checkbox.htm

Ktoś wie czemu tak się dzieje ?






?
erix
16.07.2009, 12:46:32
Cytat
$('input[name=test\[\]]').click(function() {
var wynik;
$('input[name=test\[\]]:checked')

Jest to podwójne wyszukanie. Przecież możesz zapisać elementy do zmiennej, z której skorzystają obie konstrukcje. Do drugiego przypadku wycinasz, co Ci trzeba przez filter() i gitara.

Cytat
i już prawie działa bo wyświetla wartości ale za każdym razem wyświetla na początku undefined

No jak ma działać, skoro onclick jest odpalany przed zaznaczeniem któregoś z checkboxów? - to nie to. [;
arzach
16.07.2009, 13:01:33
Cytat(erix @ 16.07.2009, 13:46:32 ) *
Jest to podwójne wyszukanie. Przecież możesz zapisać elementy do zmiennej, z której skorzystają obie konstrukcje. Do drugiego przypadku wycinasz, co Ci trzeba przez filter() i gitara.


No jak ma działać, skoro onclick jest odpalany przed zaznaczeniem któregoś z checkboxów?


Zrobiłem tak jak piszesz.

[HTML] pobierz, plaintext 
  1. <script>
  2. $(document).ready(function() {
  3. var element = $('input[name=test\[\]]');
  4. element.click(function() {
  5. var wynik;  
  6. element.filter(":checked").each( function(){
  7. wynik += $(this).val() + '<br>';
  8. });
  9. $('#wynik').html('Wybrales <br>' + wynik);
  10. }); 
  11. });
  12. </script>
  13.  
  14.  
  15. </head>
  16. <body>
  17. <div id="wynik"></div>
  18. <input type="checkbox" name="test[]" value="samochod" />samochod 
  19. <input type="checkbox" name="test[]" value="dom" />dom
  20. <input type="checkbox" name="test[]" value="bizuteria" />bizuteria
  21. <input type="checkbox" name="test[]" value="zwierzeta" />zwierzeta
[HTML] pobierz, plaintext


Cytat
No jak ma działać, skoro onclick jest odpalany przed zaznaczeniem któregoś z checkboxów?


Ale dalej nie wiem jak pozbyć się tego błędu możesz coś bardziej nakierować ?
erix
16.07.2009, 13:09:17
Ustaw jakąś wartość dla wynik przed dopisywaniem, a nie tylko deklarujesz, że ma być zmienna.
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.