I had message which is generated from the system and it consist of including a URL with an anchor tag in a Jquery model popup. I usually keep my strings/messages in resource files.  In this case it had a place holder to be replaced with the URL.

As an example,

“Please <a class=’link_color’ href='{url}?returnUrl={path}’>CLICK HERE</a> to Log in.<br/><br/>If you have not signed up <a class=’link_color’ href='{regurl}?returnUrl={path}’>CLICK HERE.</a>”

It was rendering above text as it is in the popup without rendering the HTML tags as hyperlinks,

When I checked the message that was assigned to the popup, its as follows,

“Please &lt;a class=’link_txt_color’ href=’/Account/LogOn?returnUrl=/Deal/4856/victorias-discount-bridal-service#.USIBq2dy18v’&gt;CLICK HERE&lt;/a&gt; to Log in.&lt;br/&gt;&lt;br/&gt;If you have not signed up &lt;a class=’link_txt_color’ href=’/Account/CreateNewUser?returnUrl=/Deal/4856/victorias-discount-bridal-service#.USIBq2dy18v’&gt;CLICK HERE.&lt;/a&gt;”

This is not what I expected to render in the popup.  So I created a div tag dynamically (with jQuery its very simple $(“<div/>”)) and assigned the above message as a HTML. Then I took the text rendered in the div, and assigned that to the popup. There you go, nicely rendered with anchor tags.

Sample code:


s – is the altered message with actual URLs

Note that, in this way you can deal with any html tags. If the tags are rendered as text, get the text and assigned it back as HTML.



One thought on “How to render HTML by passing it as a text in Javascript

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s