Forum PHP.pl > [JavaScript]Input radio JS

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [JavaScript]Input radio JS

neo1986kk

2.03.2010, 13:19:36

Witam, chcialbym zrobić coś takiego że mam 2 tabele:

|uzyj tabeli a i tu <input type radio>|uzyj tabeli b i tu <inpu type radio>
| tu jest tr id=tab1 | tu jest tr id =tab2
i tak w dół
i teraz chce uzyskac coś takiego że jak kliknę "uzyj tabeli a" to zniknie mi tr id=tab2

zrobiłem coś takiego:

[PHP] pobierz, plaintext 
function wydajp()
 
{
var formularz = document.forms['tabele'];
if(formularz.tabela.value == 'on')
{
document.getElementById('tab1').style.display = 'none';
document.getElementById('tab2').style.display = 'block';
 
}
 
[PHP] pobierz, plaintext

no i dziala, ale jak klikne uzyj tabeli b to sie dzieje to samo bo <input radio ma tą samą nazwę = tabela, a przecież nie moge zmienić nazwy.

teraz tak: dlaczego value jest on?? skoro ja wpisałem <input type radio value="1"> wtedy by bylo prosciej bo na drugi bym ustawił value 2 i po wszystkim, radio przybiera value on/off?

A może radio nie jest tu dobrym rozwiązaniem?
Pozdrawiam

mortus

2.03.2010, 14:25:18

Radio wydaję się być dobrym rozwiązaniem, a dzieje się to samo, ponieważ to się ma dziać:

Cytat(neo1986kk @ 2.03.2010, 13:19:36 )

[PHP] pobierz, plaintext 
document.getElementById('tab1').style.display = 'none';
document.getElementById('tab2').style.display = 'block';
[PHP] pobierz, plaintext

Wydaje mi się natomiast, że algorytm powinien być nieco inny. W pierwszym kroku ukrywamy wszystkie tabele, a w drugim pokazujemy tą, do której odnosił się przycisk radio. Sam sprawdź:

[HTML] pobierz, plaintext 
<html>
	<head>
		<script type="text/javascript">
			function showOnlyThisTable(emt) {
                                tabele = document.getElementsByTagName('table');
				for (var i = tabele.length - 1; i >= 0; i--){
					tabele[i].style.visibility = 'hidden';
				};
				document.getElementById('tab' + emt.value).style.visibility = 'visible';
			}
		</script>
	</head>
	<body>
		<form action="index.php" method="post">
			<input type="radio" name="tabela" value="a" onclick="showOnlyThisTable(this);"/>Wybierz tabelę A<br/>
			<input type="radio" name="tabela" value="b" onclick="showOnlyThisTable(this);"/>Wybierz tabelę B<br/>
		</form>
		<table id="taba">
			<tr><td>taba</td></tr>
		</table>
		<table id="tabb">
			<tr><td>tabb</td></tr>
		</table>
	</body>
</html>
[HTML] pobierz, plaintext

Radio zwraca swoją własną wartość ustawioną poprzez value!

neo1986kk

2.03.2010, 15:28:07

[PHP] pobierz, plaintext 
<li class="li1">		<[url="http://december.com/html/4/element/script.html"]script[/url] type="text/javascript"><li class="li2">			function showOnlyThisTable(emt) {<li class="li1">                                tabele = document.getElementsByTagName('table');<li class="li2">				for (var i = tabele.length - 1; i >= 0; i--){<li class="li1">					tabele[i].style.visibility = 'hidden';<li class="li2">				};<li class="li1">				document.getElementById('tab' + emt.value).style.visibility = 'visible';<li class="li2">			}<li class="li1">		</[url="http://december.com/html/4/element/script.html"]script[/url]>
[PHP] pobierz, plaintext

tego nie miałem nie miałem pętli tylko poprostu chciałem działać na value
zaraz zobacze co z tego bedzie.

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.