Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: kilka pytan dot. checkbox
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
acztery
4.08.2007, 11:48:20
mam kilka pyt dot. checkbox

1. Mam liste checkbox każdy ma swoje id i jest umieszczony w tanej komórce w tabeli jak zrobic ze po zaznaczeniu tego checkbox ta komorka zmienia tlo na czerowne np tak jak jest w phpmyadmienie

2. Ta sama lista po zaznaczeniu checkbox pojaie sie pole np <div>bla</div>

punt 2 prawie ok

mam takie cos

[HTML] pobierz, plaintext 
  1. <script type="text/javascript">
  2. function twist( recipient,recipientcheck)
  3. {
  4. divobj = document.getElementById( recipient );
  5. checkbox = document.getElementById( recipientcheck );
  6.  
  7. if(checkbox.checked){
  8. divobj.style.position = "relative";
  9. divobj.style.visibility = "hidden";
  10. }else{
  11. divobj.style.position = "absolute";
  12. divobj.style.visibility = "hidden";
  13. }
  14. }
  15. </script>
[HTML] pobierz, plaintext


ale np mamy 5 pol checkbox zaznacze 1 pokazuje sie , zaznacze 2 i 3 tez sie pokaze ale jak zamkne np 2 to div znika mimo tego ze 1,3 jest zaznaczony.
konys
4.08.2007, 18:20:31
Tak na szybko wklepane - musisz to sobie dostosować:

[HTML] pobierz, plaintext 
  1. <html>
  2.  <head>
  3.   <style type="text/css">
  4. 	.transparent {background-color:transparent}
  5. 	.red {background-color:#C00}
  6. 	#checkboxTest {display:none; width:100%; background:#C00; padding:3px; border:1px solid #999}
  7.   </style>
  8.   <script>
  9. 	function changeParentClass(obj) {
  10. 		if (obj.checked) {
  11. 			obj.parentNode.className = 'red';
  12. 		} else {
  13. 			obj.parentNode.className = 'transparent';
  14. 		}
  15. 		if (isAnyChecked()) {
  16. 			document.getElementById('checkboxTest').style.display = 'block';
  17. 		} else {
  18. 			document.getElementById('checkboxTest').style.display = 'none';
  19. 		}
  20. 	}
  21.  
  22. 	function isAnyChecked() {
  23. 		table = document.getElementById('checkboxTable');
  24. 		checkboxes = table.getElementsByTagName('input');
  25. 		for (i=0; i< checkboxes.length; i++) {
  26. 			if ('checkbox' == checkboxes[i].type && checkboxes[i].checked) {
  27. 				return true;
  28. 			} 
  29. 		}
  30. 		return false;
  31. 	}
  32.   </script>
  33.  </head>
  34.  <body>
  35.   <div id="checkboxTest">Test checkboxow</div>
  36.   <table width="50%" id="checkboxTable">
  37.   <tr>
  38.    <td><input type="checkbox" id="ch1" onchange="changeParentClass(this)" /></td>
  39.   </tr> 
  40.   <tr>
  41.    <td><input type="checkbox" id="ch2" onchange="changeParentClass(this)" /></td>
  42.   </tr> 
  43.  </body>
  44. </html>
[HTML] pobierz, plaintext
acztery
4.08.2007, 22:17:54
super prawie jest ok

a jak mma takie

<tr> <td>tytul</td><td>opis</td><td><input type="checkbox" id="ch2" onchange="changeParentClass(this)" /></td> </tr>

i chce aby cala komorka TR byla czerwona to nie mam pomysu probowalem ale raczkuje w JS

zmienilem na takie cos ale cos nie teges

[HTML] pobierz, plaintext 
  1. if (obj.checked) {
  2. document.getElementsByTagName('tr').parentNode = 'red';
  3. } else {
  4. document.getElementsByTagName('tr').parentNode = 'transparent';
  5. }
[HTML] pobierz, plaintext
konys
6.08.2007, 07:26:31
To dobry przykład do nauki modelu DOM. W Twoim przypadku powinieneś dotrzeć do elementu nadrzędnego jakim jest TR i wszyskim jego potomkom TD przyporządkować odpowiednią klasę.
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.