How to render one piece of hairball?

Using the HTMLControl class in .NET Framework

25 September 2010 | 11:40 | Galina Slavova

At some point I had to rewrite a piece of software in C# .Net in order to render a dynamic control in a SharePoint based website. The old version was using the TextWriter object at the moment that the Render() method kicks in. "Render" is the last event in the ASP.Net web form page lifecycle, and the last chance to do work on the server before sending the Html back to the client. ( Here is a link to double check the page lifecycle stages. )

I threw away the whole fashion of typing Html elements as strings with the TextWriter in the code-behind which burdens you with the additional task to not forget closing tags when you are doing routines like this:

  • write an opening tag
  • write the thing that actual matters
  • write the closing tag

Instead, I introduced a dynamic control rendering by using the HtmlControl class and its derivatives in the new software version

Building a dynamic Html control structure with the Control class and its derivatives.

This code rendered a perfect Html in Internet Explorer 7 ( and higher versions ) browser,

Html rendered in IE7, 8 and 9.

but the feel-good disappeared when I opened the page in FireFox (the second required browser). It was not pretty, because the content was not wrapped:

Mozilla FireFox.

It was clear that the styles did not manage to wrap the HTML list elements li in the div container... But why?

Then I opened the HTML source code and saw that the browser didn't recognize the rendered control as a neatly indented Html structure of elements, but rather saw one uninterrupted long string. A piece of hairball!

At first I wanted to try adding a Environment.NewLine ( "\n\r" ) character somewhere in between the controls in my class method, just to break the string, but there wasn't any straightforward way to do this.

In the end, what solved the rendering problem in FireFox was wrapping up the carriage return character in a whole new control object

which could be easily attached to the container control object as any other contro with a meaning:
ul.Controls.Add( new NewLineControl() );

  • C#
  • .NET
  • HtmlControl class