Autor Zpráva
PepaZDepa
Profil *
Ahoj,

řeším problém, kdy potřebuji, aby se mi v tabulce text nezalamoval na 2 řádky (např když je v nějaké buňce delší). Potřebuji tedy pomocí javascriptu (programově to možné není, tabulka je generovaná tak, že programátor není schopen výpis dat ovlivnit) nahradit veškeré mezery v mezi texty v tabulce za znaky non breaking space " ", což zapříčiní to, že se text nebude zalamovat.

Lze nějak jednoduše nahradit veškeré mezery v dané tabulce za tyto pevné? Na webu využívám jQuery, kdyby to usnadnilo situaci. 2x se mi nechce iterovat přes jednotlivé řadky tabulky, v nich dohledávat td/th, z nich si vybrat obsah v něm následně nahradit mezery a poté ho vložit. Příjde mi to hrozně složité, možná to jde jednodušeji. A další problém je ten, že někdy struktura řádku vypadá takto:
<tr><td><strong>Text s mezerou</strong></td></tr>

a někdy jen takto:
<tr><td>Text s mezerou</td></tr>



Děkuji za tipy
PepaZDepa
Profil *
tak jsem zkusil toto:
        var test = $('.tabulka').html().replace("text", "nahradime_text_za_XXX");
	$('.tabulka').html(test);


zatím jen nahrazuji slovo "text" za jiné slovo... ovšem funguje mi to pouze na první řádek tabulky (resp. pouze na jednu buňku tabulky.. když se slovo "text" vyskytuje v tabulce vícekrát, tak jej nahradí jen jednou a to u prvního výskytu).
panther
Profil
PepaZDepa:
ač se mi JS řešení nelíbí (lépe by to bylo v PHP, .replaceAll().
PepaZDepa
Profil *
PHP nepřipadá v úvahu, jelikož aplikace na něm ani neběží.
PepaZDepa
Profil *
odeslla jsem příspěvek dříve než jsem stihl poděkovat. Takže děkuji a jdu vyzkoušet.
Chamurappi
Profil
Reaguji na PepuZDepa:
nahradit veškeré mezery v mezi texty v tabulce za znaky non breaking space "&nbsp;", což zapříčiní to, že se text nebude zalamovat
Těžko. Mezera není jediným znakem, který dovoluje zalomení.

iterovat přes jednotlivé řadky tabulky, v nich dohledávat td/th, z nich si vybrat obsah v něm následně nahradit mezery a poté ho vložit
Brr. Přepsáním innerHTML zrušíš všechny elementy uvnitř (a vlastnosti na ně navěšené, kterou nejsou patrné v HTML) a vyrobíš zbrusu nové. Možná by to ve tvé situaci nevadilo, ale stejně je to humpolácké řešení (to, že je možná jednoduché na napsání, ho neospravedlňuje).

Když už bys chtěl iterovat, nastudoval bych si na tvém místě atributy buňky tabulky a sáhnul po tom, který doopravdy zabrání zalamování. Ale řešení v CSS je samozřejmě jednodušší.
PepaZDepa
Profil *
Chamurappi:
Ano vím, zalamují se i znaky jako "+", ",", "-" atd atd... ovšem data v tabulce tyto znaky neobsahují a v budoucnu je nikdy obsahovat nebudou. Mohu je tedy se 100 procentní jistotou vypustit a neuvažovat o nich

No, nejsem si jistý zda řešení pomocí CSS je jednodužší. Vyjasním situaci úplně, třeba napadne někoho jiné řešení:

Tabulka má cca 20 sloupců a šířka stránky je jen 900px (tabulka má celkově přes 2000px). Na tabulku je navěšená JS komponenta, která zařizuje řazení buněk v tabulce, skrývání sloupců (aby se jich nezobrazovalo tolik a tabulka se vešla do 900px) a také stránkování (jelikož tabulka obsahuje přes 1000 řádků). Tabulka je zanořená do divu, který ma nastaveno overflow:auto, aby se zobrazil scrollbar, když je tabulka moc dlouhá (když jsou zobrazeny všechny sloupce).

Moc si neumím představit, jak bych to řešil pomocí CSS. Pevné šířky sloupců nastavit nemohu, jelikož nevím kolik ve sloupci bude textu. Zde bych jedině mohl spočítat počet písmen úpomocí JS v dané buňce v daném sloupci, zjistit kde se vyskytuje nejdelší řetězec, na základě toho vypočitat, jak je tento string dlouhý (např v pixelech) a na základě toho nastavit sloupci pevnou šířku.

Přepsat vše v tabulce pomocí innerHTML již upraveným html by asi šlo.. moc šťastné řešení to není, ale asi bude vyhovující.
PepaZDepa
Profil *
aha :) ještě poznámka... koukám "nowrap" zařídí, aby se text nezalomil.. tak to jsem nevěděl :) jdu to vyzkoušet
Chamurappi
Profil
Reaguji na PepuZDepa:
Moc si neumím představit, jak bych to řešil pomocí CSS.
koukám "nowrap" zařídí, aby se text nezalomil..
V pravém sloupci odkázané tabulky na JPW máš zmíněný CSS ekvivalent. Nepotřebuješ JS, stačí:
.tabulka { white-space: nowrap; }

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

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

0