[.NET] HTML die rendert als whitespace verwijderen

[NickThissen]

Hey,

Ik draai al een tijd een web applicatie waar (admin) gebruikers via een HTML editor tekst kunnen invoeren die daarna op de website getoond wordt. De tekst bevat dus HTML tags zoals <b> en <p> en <br />, etc.

De rauwe HTML wordt opgeslagen in een database en daarna via ASP.NET in een Literal control getoond, zodat de formatting (kleur, stijl, etc) getoond wordt.

Het probleem is nu dat veel gebruikers soms (per ongeluk) enters of spaties voor en achter de tekst plaatsen. De verschillende stukjes tekst worden boven elkaar geplaatst op de site, en door deze enters is de afstand tussen de stukjes variabel, wat niet gewenst is.

Wat ik dus eigenlijk wil doen is alle tags trimmen die uiteindelijk als whitespace zouden renderen. Ik zat eerst te denken aan een simpele String.Trim() , maar dat werkt natuurlijk niet; de string bevat zelf geen whitespace maar de tags renderen uiteindelijk wel als whitespace!

Het probleem is nu dat ik heel veel combinaties van tags kan bedenken die uiteindelijk als whitespace renderen, en ik kan ze nu wel allemaal afgaan in mijn code (liefst met regex ofzo) om ze te verwijderen, maar ik zal er altijd een paar vergeten, en vroeg of laat zal iemand precies die combinatie die ik vergeet weten te produceren...

Bijvoorbeeld, deze tags op het einde zijn makkelijk te herkennen en verwijderen:

code:

<br>
<br />
<br></br>
<p></p>
&nbsp;

Maar deze strings (even elke regel apart nemen) zullen ook whitespace op het eind hebben;

code:

<p>Blabla.. <br /><br /></p>
Tekst <b>hier <br />&nbsp; </b>

Het probleem is hier dat de tags die voor de whitespace zorgen binnen in andere tags zitten die niet weg moeten (</p> en </b> in dit geval), maar gerenderd zullen ze toch voor whitespace zorgen...


Is er een standaard manier om deze whitespace te verwijderen waar ik niet van weet? Of is het echt zo moeilijk als ik nu denk? Dit zal toch wel een bekend probleem zijn dus ik kan me bijna niet voorstellen dat er geen snelle makkelijke oplossing zal zijn...

Note: de HTML editor zal misschien wel een ingebouwde functionaliteit hebben om ervoor te zorgen dat de output geen gerenderde whitespace bevat, dat zou al helpen, maar het probleem is dat er al veel tekst in de database staat die ik dus ook moet trimmen. Het liefst zou ik dus de tekst elke keer trimmen voordat deze op de pagina komt (dus nadat ik hem uit de database laadt). Tenzij het trimmen extreem langzaam is zou dat geen probleem moeten zijn denk ik..?


Bedankt!

[RobIII]

Dit is een "probleem" dat je, IMHO, niet technisch moet willen oplossen maar door je gebruikers op te voeden/trainen. Zoals je zelf al zegt krijg je 't toch nooit goed, en anders heb je altijd wel een slimmerik die die weer doet:

HTML:

<img src="/img/onepixtransparent.gif" width="1" height="150">

Als ze whitespace willen krijgen ze 't toch wel. Daar is niet tegenaan te regexen/programmeren. Al helemaal niet als je ze vrij laat zelf (al dan niet m.b.v. een WYSIWYG editor) zelf HTML te "schrijven".

Als je dit toch wil doorzetten zou je eens kunnen proberen de DOM te doorlopen en gewoon elementen aan 't begin/eind van de content zonder text (<br>, <p></p>) eraf strippen; maar dan moet je weer uitzonderingen maken voor bijvoorbeeld images. En dan moet je nog rekening houden dat tekstcontent als &nbsp; ook als whitespace telt enz. enz. Met regexen ga je je heel diep in de nesten werken; als je dit al doorzet ga dan voor de DOM methode. Dan is bijvoorbeeld een <br> vs <br /> en <p></p> vs <p style="border:1px solid red"></p> en alle mogelijke vage combinatie etc. in ieder geval al 'tzelfde gerepresenteerd en hoef je je om die flauwekul geen zorgen te maken.

Hou er rekening mee dat je mogelijk een recursieve functie nodig hebt om, bijv, <p><br></p> 'op te ruimen'

[ Voor 62% gewijzigd door RobIII op 30-08-2011 12:23 ]

[NickThissen]

Qua images zal het geen probleem zijn, die zullen er niet inkomen, en als ze die er wel in stoppen (weet niet of het uberhaupt wel kan) dan weten ze vast ook wel waar ze mee bezig zijn. Het probleem is vooral dat ze per ongeluk whitespace toevoegen zonder dat ze het doorhebben en zich dan afvragen waarom er opeens meer ruimte tussen twee items zit dan normaal.

Ik zoek dan ook niet een oplossing die de user 100% verbied om whitespace toe te voegen, maar meer een oplossing die alle gevallen die per ongeluk whitespace kan produceren eruit haalt.

Maar goed, ik had al zo'n vermoeden dat regex geen oplossing zou zijn. De DOM doorlopen zal ik eens onderzoeken, dat klinkt wel interessant.

Ten slotte, de gebruiker vertellen dat ze hiermee moeten uitkijken is iets wat ik sowieso wel ga doen, maar er zit al een hoop van deze 'rotzooi' in de database, en ik heb geen zin hem handmatig op te schonen.

[creator1988]

Ergens is het ook gewoon het gevolg van die 'WYSIWYG' editors in de browser die allemaal gewoon heel erg ruk werken. Ik denk dat gebruikers over het algemeen blijer worden van iets als Markdown (http://daringfireball.net/projects/markdown/), met een goede preview functie.