[JavaScript]Zmiana stylu wielu elementów Opcje

[Mlodycompany]

Witam. Mam taki kodzik

[HTML] pobierz, plaintext 
function pokazFormy(id){
	var id_t = "id_" + id + "_t";
	var id_f = "id_" + id + "_f";
	var t = document.getElementById(id_t);
	var f = document.getElementById(id_f);
 
	t.style.display = "none";
	f.style.display = "block";
}
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
<tr>
				<th>
				<span id="id_'.$row[0].'_t">'.$row['ID'].'</span>
				<span id="id_'.$row[0].'_f" style="display: none;"><input value="'.$row[0].'"></span>
				</th>
				<th>
				<span id="id_'.$row[0].'_t">'.$row[1].'</span>
				<span id="id_'.$row[0].'_f" style="display: none;"><input value="'.$row[1].'"></span>
				</th>
				<th>
				<span id="id_'.$row[0].'_t">'.$row[2].'</span>
				<span id="id_'.$row[0].'_f" style="display: none;"><input value="'.$row[2].'"></span>
				</th>
				<th>
				<span id="id_'.$row[0].'_t">'.$row[3].'</span>
				<span id="id_'.$row[0].'_f" style="display: none;"><input value="'.$row[3].'"></span>
				</th>
				<th>
				<span id="id_'.$row[0].'_t">'.$row[4].'</span>
				<span id="id_'.$row[0].'_f" style="display: none;"><input value="'.$row[4].'"></span>
				</th>
				<th>
				<span id="zmien_'.$row[0].'"><a href="#" onclick="pokazFormy(\''.$row[0].'\');">Zmień</a></span>
				<span id="zapisz_'.$row[0].'" style="display: none;">Zapisz</a>
				<th>
				<th><a href="#">Usuń</a><th>
			</tr>
[HTML] pobierz, plaintext 

Teoretycznie powinno wszystko działać, ale w praktyce jest na odwrót. Otóż po kliknięciu Zmień wszystkie spany o id="id_1_t" powinny zniknąć a w ich miejsce pojawić spany id="id_1_f" ale tak nie jest. Tylko 1 kolumna zmienia się a reszta pozostaje bez zmian. Proszę o pomoc.

[DiH]

Dzieje się tak dlatego, że atrybut id nadajemy tylko elementom unikalnym w dokumencie - tj. w jednym dokumencie może zaistnieć tylko jeden element o konkretnej wartości atrybutu id. Masz do wyboru: albo użyć klasy przeznaczonej do zmiany właściwości elementów po ich klasie, albo użycie getElemenstByTagName.

Link do wspomnianej klasy: http://robertnyman.com/2008/05/27/the-ulti...name-anno-2008/

Edit: Jeżeli wywalisz to złomowisko spanów, i zamienisz to na zwykłe dwa divy stojące obok siebie, służące jako kolumny, to Twój problem zniknie. Nadasz wtedy jednemu divowi odpowiedni id, i po kliknięciu go ukryjesz.

[HTML] pobierz, plaintext 
<div id="lewa" style="float:left">LEWA</div>
<div id="prawa" style="float:left">PRAWA</div>
<div style="clear:both"><a href="java script: lewa.style.display='none'">Ukryj</a></div>
[HTML] pobierz, plaintext 

Ot, cały kod.

Ten post edytował DiH 21.03.2010, 11:33:54