Autor Zpráva
David11
Profil
Můžete mi prosím poradit čemu správně přiřadit id když chci javascriptem zneviditelnit kus tabulky?
Odladil jsem zneviditelnění kusu tabulky v IE11 a Chrome takto a fungovalo vše OK (id jsem dal do <tr>) :

<table border="0" cellspacing="0" cellpadding="4" width="748">
<tr id="ID_TR_001">
<td width="128" align="left">
<img src="jpg/001.jpg" width="120" height="67" title="Youtube" style="border-color:#FFFFFF" border="2"></td>
<td width="594" align="left" valign="bottom">
<font face="Century Gothic" style="font-size: 8pt" color="#CC9966">TEXT1</font></td>
</tr>
<tr>
<td width="128" align="left">
<img src="jpg/002.jpg" width="120" height="67" title="Youtube" style="border-color:#FFFFFF" border="2"></td>
<td width="594" align="left" valign="bottom">
<font face="Century Gothic" style="font-size: 8pt" color="#CC9966">TEXT2</font></td>
</tr>
</table>
<script>
if (NezobrazKusTabulky() == 1) document.getElementById("ID_TR_001").innerHTML = "";
</script>

Pak jsem ale zjistil, že to nefunguje v IE8. Pak jsem přišel na to, že tam zafunguje toto (id je ve <span>, kterým jsem obalil <tr>, ve kterém jsem id zrušil) :

<table border="0" cellspacing="0" cellpadding="4" width="748">
<span id="ID_TR_001">
<tr>
<td width="128" align="left">
<img src="jpg/001.jpg" width="120" height="67" title="Youtube" style="border-color:#FFFFFF" border="2"></td>
<td width="594" align="left" valign="bottom">
<font face="Century Gothic" style="font-size: 8pt" color="#CC9966">TEXT1</font></td>
</tr>
</span>
<tr>
<td width="128" align="left">
<img src="jpg/002.jpg" width="120" height="67" title="Youtube" style="border-color:#FFFFFF" border="2"></td>
<td width="594" align="left" valign="bottom">
<font face="Century Gothic" style="font-size: 8pt" color="#CC9966">TEXT2</font></td>
</tr>
</table>
<script>
if (NezobrazKusTabulky() == 1) document.getElementById("ID_TR_001").innerHTML = "";
</script>

- ale to zas nefunguje v IE11.
Rád bych, aby to fungovalo všude. Je správné toto řešení? (id je jak ve <span>, tak v <tr>) :

<table border="0" cellspacing="0" cellpadding="4" width="748">
<span id="ID_TR_001">
<tr id="ID_TR_001">
<td width="128" align="left">
<img src="jpg/001.jpg" width="120" height="67" title="Youtube" style="border-color:#FFFFFF" border="2"></td>
<td width="594" align="left" valign="bottom">
<font face="Century Gothic" style="font-size: 8pt" color="#CC9966">TEXT1</font></td>
</tr>
</span>
<tr>
<td width="128" align="left">
<img src="jpg/002.jpg" width="120" height="67" title="Youtube" style="border-color:#FFFFFF" border="2"></td>
<td width="594" align="left" valign="bottom">
<font face="Century Gothic" style="font-size: 8pt" color="#CC9966">TEXT2</font></td>
</tr>
</table>
<script>
if (NezobrazKusTabulky() == 1) document.getElementById("ID_TR_001").innerHTML = "";
</script>

Může to id být stejné jak v tom <span>, tak v tom <tr>? Nebo tam mám raději dát dvě různé id a v tom ifu na konci přiřadit prázdný řetězec oběma elementům?
Nebo se to má správně řešit nějak úplně jinak?
Tomášeek
Profil
tbody
David11
Profil
Tomášeek:
Díky za reakci. Myslíš to tak, že mám místo <span id="ID_TR_001"> použít <tbody id="ID_TR_001">, do <tr> žádné id dávat nemám a bude to tak fungovat ve všem? Čili takto? :

<table border="0" cellspacing="0" cellpadding="4" width="748">
<tbody id="ID_TR_001">
<tr>
<td width="128" align="left">
<img src="jpg/001.jpg" width="120" height="67" title="Youtube" style="border-color:#FFFFFF" border="2"></td>
<td width="594" align="left" valign="bottom">
<font face="Century Gothic" style="font-size: 8pt" color="#CC9966">TEXT1</font></td>
</tr>
</tbody>
<tr>
<td width="128" align="left">
<img src="jpg/002.jpg" width="120" height="67" title="Youtube" style="border-color:#FFFFFF" border="2"></td>
<td width="594" align="left" valign="bottom">
<font face="Century Gothic" style="font-size: 8pt" color="#CC9966">TEXT2</font></td>
</tr>
</table>
<script>
if (NezobrazKusTabulky() == 1) document.getElementById("ID_TR_001").innerHTML = "";
</script>
Kajman
Profil
Pokud se má řádek odstranit, tak použijte removeChild...

if (NezobrazKusTabulky() == 1) {
  var elem = document.getElementById("ID_TR_001");
  if ( elem ) { elem.parentNode.removeChild( elem ); }
}

Pokud chcete řádek jen schovat a mít možnost ho ještě v budoucnu použít, tak můžete použít obdobně
  if ( elem ) { elem.style.display = "none"; }

Případně řádku či tbody nastavit class, která způsobí v kombinaci s css styly schování.


To tbody je vhodné, pokud chcete pracovat s více řádky, které jsou za sebou. Tbody může být v tabulce vícekrát, tak tím lze řádky seskupovat pro lepší práci.
David11
Profil
Kajman:
Díky za odpověď. Chápu to tedy správně tak, že ten html kód v mém minulém příspěvku je správně (tzn. mám obalit <tr> tím <tbody id="ID_TBODY">) a v tom scriptu mám správně použít (pokud chci nějaký řádek jen dočasně zneviditelnit) toto? :

if (NezobrazKusTabulky() == 1) {
  var elem = document.getElementById("ID_TBODY");
  if ( elem ) { elem.style.display = "none"; }
}

A cháputo správně tak, že to innerHTML se tedy může používat jen např. pro jednoduché texty, např. takto:
<span id="ID_SPANU">Tento text přiřazením řetezce do innerHTML zneviditelni nebo změň</span>
- a používat ho na cokoli jiného může způsobovat to, že to v některém prohlížeči nebude fungovat?
Kajman
Profil
Tbody použijete jen v případě, že chcete pracovat s více řádky, co jsou u sebe.

Atribut id můžete nastavit i tr i tbody, záleží co chcete mazat. <span> přímo v <table> je chybou, kterou mohou různé prohlížeče různě opravovat.

innerHTML mění obsah elementu, takže když ho vyprázdníte, stále ten řádek bude existovat, ale nemá žádnou buňku. Nevím, jestli to je hledaný problém s IE8, možná bude v konzoli vypsaná nějaká chybová hláška.
Tomášeek
Profil
David11:
A cháputo správně tak, že to innerHTML se tedy může používat jen např. pro jednoduché texty
Ne. Délka innerHTML není omezena jen na krátké texty.

a používat ho na cokoli jiného může způsobovat to, že to v některém prohlížeči nebude fungovat?
Ne.


Kajman:
Tbody použijete jen v případě, že chcete pracovat s více řádky, co jsou u sebe.
Četl jsem "schovat kus tabulky", nevšiml jsem si, že se jedná jen o jeden řádek. Tbody je zde zbytečné, nicméně ne chybné (dá se bezpečně použít i v tomto případě, ničemu nevadí, že obaluje jen jeden řádek).
David11
Profil
Kajman, Tomášeek:

Díky za rady, už mi vše funguje i v IE8 - nakonec jsem to id nechal v tom <tr>, musel jsem jen místo innerHTML="" použít to style.display="none".

On se ten IE8 zřejmě chová hodně podivně i jinak - tohle je jen taková "perlička", kterou jsem vyřešil tím, že jsem "učesal" kód - nicméně řekl bych, že zcela chybný (jen zbytečně nešikovný) by neměl být ani ten "neučesaný" kód (nebo se pletu?). Jde o to, že jsem tam v určité situaci nejdřív pomocí window.document.write vykreslil do html ten řádek tr (včetně toho id) - a pak jsem se o kus dál pomocí toho style.display="none" snažil ten řádek zase zneviditelnit. IE11 i Chrome to "skously", IE8 ne. Ale nijak mě to netrápí - vyřešil jsem to tím "učesáním" kódu - na místě, kde se ten řádek má (někdy) vykreslit, jsem rozšířil tu podmínku, zda se má vykreslit o ten další test, který jsem předtím zcela nesmyslně pouštěl až později (a kde pak to zneviditelnění v IE8 už nezafungovalo).

Každopádně díky za rady.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: