X
dnn.blog.
Back

Flexible module design with templates

When you create a module not only for you and for one special portal, you have to decide how to accomplish the multiple design demands your customers have. You can create a fixed design and deal with a lot of classes, so the user can do all the styling with CSS. But in my opinion, this is often not flexible enough. The most flexible solution is in my eyes working with templates and token replace. With this technique you can give your users the widest possible range of possibilities for arranging all the stuff they need in the design they want.

Think of a RSS module where you can style the display of  the news. On one page you want only the headline and date, on another page you need the full text, the date under the text and the headline above… You will never be able to realize all possible combinations with settings like “Show title under text” or “Don’t show headline”

Needed UI elements

In the settings section of your module, you need only a few elements

Template

The user can insert his html-code into the textbox and he can insert the tokens you create for him. It is a good idea to give him some information about these tokens if he clicks the help button :

Helpbutton

And if he struggles give him a “Reset to default” – button where he can reset the template to a default display text!

Generating output

The first thing we need is a placeholder control where you later insert our generated output:

<asp:placeholder id="newsPlaceHolder" runat="server"></asp:placeholder>

In the next step we create a new method in my view control called RenderTemplate. This method receives two parameters:

  • The template text (string)
  • The data object (eg. NewsInfo, POCO object with properties like Title, Link, Description and so on…)
  • Return value is of type Control !
private Control RenderTemplate(NewsInfo news, String template)

In RenderTemplate, we need to replace all our tokens with a string representation of ASP.NET-Controls:

template = template.Replace("[TITLE]", "<asp:label id='\"lblHeadline\"' runat='\"server\"'>");
template = template.Replace("[LINK]", news.Link);
template = template.Replace("[TITLELINK]", "<asp:hyperlink id='\"lnkLink\"' runat='\"server\"'>");
template = template.Replace("[DESCRIPTION]", "<asp:literal id='\"ltrDescription\"' runat='\"server\"' mode='\"PassThrough\"'>");
template = template.Replace("[NEWS]", "<asp:literal id='\"ltrNews\"' runat='\"server\"' mode='\"PassThrough\"'>");
template = template.Replace("[PUBDATE]", "<asp:label id='\"lblPubDate\"' runat='\"server\"'>");
template = template.Replace("[SOURCE]", "<asp:label id='\"lblSource\"' runat='\"server\"'>");</asp:label></asp:label></asp:literal></asp:literal></asp:hyperlink></asp:label>

The next step is very important. Now we make a control of our template string !

Control ctrl = ParseControl(template);

The rest is easy now. We need to find every Control inside of ctrl. If it exists, we set the values (if not, the user hasn’t used the appropriate token)

lblHeadline = FindControlRecursive(ctrl, "lblHeadline") as Label;
if (lblHeadline != null)
	lblHeadline.Text = (TitleLimit > 0 ? ShortenString(news.Title, TitleLimit) : news.Title);

lnkLink = FindControlRecursive(ctrl, "lnkLink") as HyperLink;
if (lnkLink != null)
{
	lnkLink.Text = (TitleLimit > 0 ? ShortenString(news.Title,TitleLimit) : news.Title);
	lnkLink.NavigateUrl = news.Link;
	if (news.Internal == false)
		lnkLink.Target = "_blank";
}

ltrDescription = FindControlRecursive(ctrl, "ltrDescription") as Literal;
if (ltrDescription != null)
	ltrDescription.Text = Server.HtmlDecode((DescriptionLimit > 0 ? ShortenString(news.Description,DescriptionLimit) : news.Description));

ltrNews = FindControlRecursive(ctrl, "ltrNews") as Literal;
if (ltrNews != null)
	ltrNews.Text = Server.HtmlDecode((NewsLimit > 0 ? ShortenString(news.News,NewsLimit) : news.News));

lblPubDate = FindControlRecursive(ctrl, "lblPubDate") as Label;
if (lblPubDate != null)
	lblPubDate.Text = String.Format("{0:" + DateFormat + "}", news.Pubdate);

lblSource = FindControlRecursive(ctrl, "lblSource") as Label;
if (lblSource != null)
{
	Uri url = new System.Uri(news.Link);
	lblSource.Text = url.Host;
}
return ctrl;

At the end we return our generated control ! (TitleLimit, DescriptionLimit, NewsLimit and DateFormat are other setting values. ShortenString is a helper method to cut of a string if it is longer as limit and add some …)

FindControlRecursive is another helper method which iterates recursive through all objects and tries to find the control with the given controlID:

private Control FindControlRecursive(Control rootControl, string controlID)
{
	if (rootControl.ID == controlID)
		return rootControl;

	foreach (Control controlToSearch in rootControl.Controls)
	{
		Control controlToReturn = FindControlRecursive(controlToSearch, controlID);
		if (controlToReturn != null)
			return controlToReturn;
	}
	return null;
}

Last thing we had to do in code behind is to call our RenderTemplate-Method and add our generated control to the placeholder:

string template = "";
if (Settings["Template"] != null)
	template = (string)Settings["Template"];
else
	template = Controller.GetDefaultTemplate();
NewsInfo news = NewsController.GetNews();
Control ctrl = RenderTemplate(News,template);
newsPlaceHolder.Controls.Add(ctrl);

And that is what it looks like (sorry it’s in german…):

Sample Post

Back
Total: 25 Comment(s)
dotNetFollower
Nice post! My own FindControlRecursive helped me out many times. Especially, when I deal with MasterPages. For example, one of such usage is shown in my post here – http://dotnetfollower.com/wordpress/2010/12/sharepoint-add-onchange-attribute-to-dropdownchoicefield/.
Thank you!
Friday, September 30, 2011 · reply ·
Josephine Barber
The only aim of the shooter in Sniper Assassin 3D Apk Guide is to aim and shoot the bad guys in the town. https://apkguide.download/
Thursday, June 21, 2018 · reply ·
Abraham	Beck
Tuesday, August 7, 2018 · reply ·
Jose	Houston
I had to do an assignment of this,i was going to getbit done from a https://www.bestdissertations.com/">dissertation service writing but there's no writer available.You've made my work so easy with this tutorial.
Friday, August 10, 2018 · reply ·
rajan
I faced the many regarding to windows problem then i see this site https://fixforwindows.com/chkdsk and i got the solution of windows problem.
Monday, August 20, 2018 · reply ·
Nikki
I know all the nodes here but I haven't worked anything for https://www.researchwritingkings.com/review-of-ninjaessays-com/. I guess that people have been looking for it and I need to work on it.
Saturday, October 6, 2018 · reply ·
coins for pixel gun 3d
Thanks a lot for sharing https://freepixelgun3dhack.com/
Monday, October 22, 2018 · reply ·
instagram viewer
I'm glad I found this web site, I couldn't find any knowledge on this matter prior to.Also operate a site and if you are ever interested in doing some visitor writing for me if possible feel free to let me know, im always look for people to check out my web site https://www.igstories.net/
Tuesday, November 20, 2018 · reply ·
free eshop codes 2019
You can redeem these points for rewards such as digital content and discounts on digital versions of games.
Thursday, February 28, 2019 · reply ·
Robert Beer
It is just what I was looking for and quite thorough as well. Thanks for posting this, I saw a couple other similar posts but yours was the best so far. The ideas are strongly https://awriter.org/boomessays-com-review/ pointed out and clearly emphasized
Tuesday, April 2, 2019 · reply ·
office.com/setup
This has been a challenging time, and I appreciate you so much.
Thursday, May 16, 2019 · reply ·
John Martin
Howdy, I’m Nick. I’m a software engineer living in Manhattan, New York. I am a fan of technology, photography, and design. I’m also interested in music and blogging. https://office-product-2019.com http://setpoffice.com http://activatemcafee.uk http://mfmcafee.com https://www.mynotronsetup.com http://mcafeeactivate.cf http://msofficesetup.uk
Thursday, May 16, 2019 · reply ·
Deam jones
Friday, May 17, 2019 · reply ·
Norton.com/setup
Norton is a well-known name offering a variety of security services to their users. It has marked its name in the market of personal as well as business security. http://gonortoncomsetup.us/
Tuesday, June 18, 2019 · reply ·
Mcafee.com/activate
McAfee.com/activate - Learn Easy Steps to do McAfee Activate Product Key and Get Started with McAfee Activation using Product Key mentioned on Retail card. http://www.mcafeecomactivates.uk
Tuesday, July 9, 2019 · reply ·
McAfee Community
http://mymcafeeactivate.com">mcafee.com/activate VirusScan is powered by McAfee, Inc. Create and maintain an antivirus program. It is not available as a standalone package, but is included in McAfee LiveSafe, McAfee AntiVirus Plus, and McAfee Total Protection.
Wednesday, July 10, 2019 · reply ·
McAfee Insights
http://mymcafeeactivate.com">mcafee.com/activate McAfee, LLC formerly known as McAfee Associates, Inc. from 1987–2014 and Intel Security Group from 2014–2017 is an American global computer security software company headquartered in Santa Clara, California
Wednesday, July 10, 2019 · reply ·
<a href=sdfdsfsdfsdf" src="/DnnImageHandler.ashx?mode=profilepic&userId=-1&w=32&h=32" />
http://www.sfdfsf.ss">sdfdsfsdfsdf
Thursday, July 11, 2019 · reply ·
geek squad tech support
The Geek Squad service is one of the primary reasons why I purchase tech products from Best Buy. Any time I've ever had to use my Geek Squad Protection Plans, I've had nothing but positive experiences."Geek Squad is the best! I love knowing my electronics are protected and there is no deductible for replacement or repair if I do have a problem.
Friday, August 9, 2019 · reply ·
geek squad
https://geekshelp.support/">geek squad tech support goes above and beyond the manufacturer's warranty to extend your coverage and protect your purchase. https://geekstechrenewal.com/">geek squad tech support
Friday, August 9, 2019 · reply ·
geek squad
geek squad tech support[/url] goes above and beyond the manufacturer's warranty to extend your coverage and protect your purchase. geek squad tech support[/url]
Friday, August 9, 2019 · reply ·
emilywilliams1025
Tuesday, August 13, 2019 · reply ·
McAfee Helpline Number Uk
Update McAfee on Mac: to update McAfee antivirus on Mac, first click on the McAfee Shield icon and then select McAfee Internet Security Console. If you are not able to open it then Contact McAfee for complete assistance. Now, click on Update under Scan and Updates in the console. In the Update Window and click Start. London, United Kingdom Contact us Now: +44-800-368-9198
Tuesday, September 10, 2019 · reply ·

about.me.

Torsten WeggenMy name is Torsten Weggen and I am CEO of indisoftware GmbH in Hanover, Germany. I'm into DNN since 2008. Before this, I did a lot of desktop stuff mainly coded with Visual Foxpro (see http://www.auktionsbuddy.de). 

I'm programmer, husband, father + born in 1965.

Please feel free to contact me if you have questions.

Latest Posts

DNN module development with Angular 2+ (Part 7)
6/10/2018 1:43 PM | Torsten Weggen
DNN module development with AngularJS (Part 6)
12/16/2016 7:00 AM | Torsten Weggen
DNN module development with AngularJS (Part 5)
12/16/2016 6:00 AM | Torsten Weggen
DNN module development with AngularJS (Part 4)
12/16/2016 5:00 AM | Torsten Weggen
DNN module development with AngularJS (Part 3)
12/16/2016 4:00 AM | Torsten Weggen
DNN module development with AngularJS (Part 2)
12/16/2016 3:00 AM | Torsten Weggen
DNN module development with AngularJS (Part 1)
12/15/2016 7:19 AM | Torsten Weggen
Blogging in DNN with Markdown Monster by Rick Strahl
11/27/2016 1:14 PM | Torsten Weggen
Creating a global token engine
11/18/2016 10:25 AM | Torsten Weggen
DnnImagehandler - Hot or not ?
2/21/2015 11:52 PM | Torsten Weggen

My Twitter

Torsten Weggen 3/17/2019

You can make a real difference in Abir ’s life. Join me on @Kiva https://t.co/NlCTgIAZAN

Torsten Weggen 2/2/2019

As a freelance developer I often get invites from headhunters. This one should be very interesting... https://t.co/CNrEXBTBuJ

Torsten Weggen 10/11/2018

Evernote or OneDrive user and love #markdown #markdownmonster ? Take a look at Joplin! https://t.co/4bzkiD6CHn