In ASP.NET MVC 4 how can I render HTML on load. I am saving some html string encoded in this form in my sql server database as type nvarchar(max).
<li><li><img id="fbPic" src="http://graph.facebook.com/567818188/picture" style="display: inline; padding-right: 10px;"><b>Bernice Zerafa</b></li><pre class="word-wrap" style="margin-left: 10%;">hellooo</pre></li>
*EDIT:*Please note that the above string is being html unencoded correctly therefore it actually shows like this:
<li><li><img id="fbPic" src="http://graph.facebook.com/567818188/picture" style="display: inline; padding-right: 10px;"><b>Bernice Zerafa</b></li><pre class="word-wrap" style="margin-left: 10%;">helloooo </pre></li>
Now on load of the page I will have a list of those html strings which are all list items with various childnodes to be appended to a unordered list tag. The list is returning ok. But it's only being displayed as is on the page i.e. the actual string is showing and the html is not being rendered.
This is my Controller Action:
public ActionResult LoadPosts(int groupId)
{
var postedText = new List<string>();
IEnumerable<Post> posts;
using (CodeShareEntities conn = new CodeShareEntities())
{
posts = conn.Posts.Where(g => g.GroupId == groupId);
foreach (var post in posts)
{
postedText.Add(post.PostData);
}
}
return Json(new { PostedText = postedText });
}
This is my jQuery Ajax call on load of the page. #posts
is an empty <ul>
in my html
jQuery.ajax({
type: 'POST',
url: '/Groups/LoadPosts',
data: { groupId: grpid },
success: function (postData) {
$.each(postData, function (index, postText) {
**postText = htmlUnencode(postText);**
$("#posts")[0].innerHTML = postText;
//// what can I do here instead of innerHTML to be
//// able to view the html correctly ?
//// append() and insert() methods in JQuery have the same result
//// I found something called @Html.Raw(Json.Encode()) maybe
//// this is relevant here ? How can I use this correctly ?
});
$('#posts').css('background', 'white');
},
traditional: true
});
Any help would be greatly appreciated!