Autor Zpráva
Onecar
Profil
Zdravím, mám obrovský problém.

Podle Yuhůova návodu jsem si sestrojil skrývání textu (http://www.jakpsatweb.cz/javascript/priklady/skryvani-odkryvani.html) a můj k=od vypadá následovně ->

<table align="center" width="609" cellpadding="3" cellspacing="1" class="table">

<span class="top-nadpis">EXPRESS 24 h.</span>
<tr class="tr-main"><td>TYP</td><td>JEN POLYMER</td><td>JEN STROJEK</td><td>CELKEM</td><td class="td-left">JEN POLYMER</td><td>CELKEM</td></tr>
<tr class="tr-small"><td><span class="hide" onclick="show('4908')">T-4908</span></td><td>30,-</td><td>251,-</td><t d>281,-</td><td class="td-left">45,-</td><td>296,-</td></tr>
<td class="skryvany" id="4908" width="605" align="center"></td>
<tr class="tr-small"><td>T-4910</td><td>45,-</td><td>226,-</td><td>271,-</ td><td class="td-left">67,50</td><td>293,50</td></tr>

.. atd.

Problém je, že vykreslená buňka nemá 605 pixelů a text v ní se zobrazí na šířku 100, jako tabulky nad ní - !important nepomáhá.

Už si s tím absolutně nevím rady, prostě to neposlouchá. Mým cílem je, aby se po kliknutí na T-x zobrazil pod řádkem prostor pro obrázek a text o šířce: 605; a výšce: auto;. Prosím poraďte...
venca12
Profil
Hoď sem i tu JS funkci, mám takový divný pocit, že zobrazuješ buňku tabulky pomocí display:block; a že to tam dělá neplechu
Onecar
Profil
Sorry na ni jsem úplně zapomněl..

<script>

function show(idecko){
el=document.getElementById(idecko).style;
el.display=(el.display == 'block')?'none':'block';
}
</script>
venca12
Profil
No popravdě je to nějaké divné. Na rovinu ti řeknu, že nápad se skrýváním/zobrazováním nějaké části tabulky se mi vůbec nelíbí.

Pokud jsem ale pochopil správně tvůj záměr, tak ty chceš zobrazit/skrýt celý řádek tabulky zhruba na šířku tabulky. Ve tvém příkladě máš několik začátečnických chyb:

1) Chceš zobrazovat a skrýtvat řádek, ten se zapisuje pomocí tr a přitom ty tam máš napsané td, viz. řádek /<td class="skryvany" id="4908" width="605" align="center"></td>/, je dobré ho tedy přepsat na /<tr class="skryvany" id="4908" width="605"><td align="center"></td></tr>/

2) Pokud chceš aby buňka zasahovala přes celou šířku tabulky musíš zadat vlastnost colspan, která ti tady evidentně chybí, tzn.: /<tr class="skryvany" id="4908" width="605"><td colspan="6" align="center"></td></tr>/

3) Řádek tabulky není blokový element, ale tabulkový. Tzn. správně když mu přiřadíš display:block, měl by dělat neplechu a na FF taky dělá. Proto je na FF nutné použít css2 vlastnost display:table-row. Na druhou stranu explorer nic takového nezná, ale zase nedělá neplechu s display:block v tabulce, takže mu můžeš nechat to co tam máš teď. Musíš tedy přidat rozlišení mezi FF a IE:
if(document.all)
el.display=(el.display == 'block')?'none':'block';
else
el.display=(el.display == 'table-row')?'none':'table-row';
/

Celý kód bude vypadat asi nějak takhle:
<script>


function show(idecko){
el=document.getElementById(idecko).style;
if(document.all)
el.display=(el.display == 'block')?'none':'block';
else
el.display=(el.display == 'table-row')?'none':'table-row';
}

</script>
<table align="center" width="609" cellpadding="3" cellspacing="1" class="table">
<span class="top-nadpis">EXPRESS 24 h.</span>
<tr class="tr-main">
<td>TYP</td>
<td>JEN POLYMER</td>
<td>JEN STROJEK</td>
<td>CELKEM</td>
<td class="td-left">JEN POLYMER</td>
<td>CELKEM</td>
</tr>
<tr class="tr-small">
<td><span class="hide" onclick="show('4908')">T-4908</span></td>
<td>30,-</td>
<td>251,-</td>
<td>281,-</td>
<td class="td-left">45,-</td>
<td>296,-</td>
</tr>
<tr id="4908">
<td class="skryvany" colspan="6" width="605" align="center" style="background-color:#006699;">cd</td>
</tr>
<tr class="tr-small">
<td>T-4910</td>
<td>45,-</td>
<td>226,-</td>
<td>271,-</ td>
<td class="td-left">67,50</td>
<td>293,50</td>
</tr>
</table>


Btw. nezapomeň na </table>
Onecar
Profil
Díky za opravdu skvělý servis. Samozřejmě se nebráním tvrzení, že můj kód má začátečnické chyby - xhtml a css se sice učím už dva roky, ale tabulky jsem nikdy nepotřeboval :-) a tedy se je ani neučil. Pro tuto koncepci se mi ale zdály lepší, a mé chudé znalosti co se tabulek týče se projevily..

Sice to pořád nějak blbne, ale nevadí. Díky za opravdu skvělý příspěvek, nevycházím z údivu. Celý systém navrhnu jinak ;).
peta
Profil *
Onecar
u tabulky bych pouzival konstrukci:
<table>

<thead>
<tr>
<th>...</th>
<td>...</td>
</tr>
</thead>

<tbody>
<tr>
<th>...</th>
<td>...</td>
</tr>
</tbody>

<tfoot>
<tr>
<th>...</th>
<td>...</td>
</tr>
</tfoot>

</table>

usetris v tvem pripade spoustu class

A urcite bych u tabulky neskryval radky. Kdyz uz, skryvat div a v nem tabulku. Prace s tabulkou IE muze vest k docela dost problemum.
venca12
Profil
Onecar ::: Nemáš za co. Napadlo mě, že pokud by jsi přece jen chtěl použít tabulky, bylo by dobré použít trochu "pokročilejšího" skriptování a ušetřil by jsi si spoustu problémů.

Mám na mysli to, že by jsi řádky tabulky, případně elementy nezobrazoval/neskrýval pomocí stylů, ale rovnou by jsi je do dokumentu vytvářel pomocí javascriptu. Jestli budeš chtít jít touto cestou, mrkni na internetu na metody createElement, appendChild, insertBefore, removeChild, replaceChild a firstChild. nastudování zabere nějaký ten čas, ale výsledek by mohl být uspokojivý.
peta
Profil *
venca12
Prace s tabulkou IE muze vest k docela dost problemum.
zvlast pri vytvareni elementu. IE to nejak spatne prepocitava a trva a trva mu to...
Toto téma je uzamčeno. Odpověď nelze zaslat.

0