how to show html preview inside grid view with asp.net 4.0

i have just created on newsletter application that for use bulk emails to clients. now i have done with code to retrieve data from sql to client side grid view. here i have specific requirement to show html preview inside iframe inside grid view.

here is my ajax call code :

function GetTemplateList(pageIndex, pageSize, name) {
            UserType = 1;
            $.ajax({
                type: "POST",
                url: "../Service/Template.asmx/ViewTemplate",
                data: '{GroupId:' + GroupId + ', name: "' + name + '",PageIndex: ' + pageIndex + ',PageSize: ' + pageSize + '}',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                async: true,
                success: OnSuccessview,
                failure: function (response) {
                    toastr["error"](response.d, "FAIL");
                },
                error: function (response) {
                    toastr["error"](response.d, "ERROR");
                }
            });
        }
    function OnSuccessview(response) {

        var xmlDoc = $.parseXML(response.d);
        var xml = $(xmlDoc);
        var data = xml.find("Data");
        var gridid = '[id*=<%=gvTemplate.ClientID %>]';
        var gridlength = $(gridid + " tr").length;
        var row;

        if (data.length >= 1 && gridlength == 1) {
            $(gridid + " tr:last").after('<tr><td></td><td></td><td></td><td></td><td></td></tr>');
            row = $(gridid + " tr:last-child").clone(true);
            $(gridid + " tr").not($(gridid + " tr:first-child")).remove();
        }
        else {
            row = $(gridid + " tr:last-child").clone(true);
            $(gridid + " tr").not($(gridid + " tr:first-child")).remove();
        }

        $.each(data, function () {
            usertype = 1;
            var customer = $(this);

            $("td", row).eq(0).html($(this).find("strCategoryName").text());
            $("td", row).eq(1).html($(this).find("strTemplateName").text());
            $("td", row).eq(2).html($(this).find("strTemplateBody").html());
            $("td", row).eq(3).html($(this).find("dtCreatedDt").text());
            $("td", row).eq(4).html("<button type='button' class='btn btn-success' data-toggle='modal' data-target='#myModal' onclick='EditData(" + $(this).find("ID").text() + ")'>Edit</button>&nbsp;&nbsp;<button type='button' class='btn btn-danger' onclick='DeleteData(" + $(this).find("ID").text() + ")'>Delete</button>");
            $(gridid).append(row);
            row = $(gridid + " tr:last-child").clone(true);
        });

        var pager = xml.find("Pager");
        $j(".Pager").ASPSnippets_Pager({
            ActiveCssClass: "current",
            PagerCssClass: "pager",
            PageIndex: parseInt(pager.find("PageIndex").text()),
            PageSize: parseInt(pager.find("PageSize").text()),
            RecordCount: parseInt(pager.find("RecordCount").text())
        });
    };

and here is my asp grid view :

<asp:GridView ID="gvTemplate" runat="server" AutoGenerateColumns="false" class="table table-bordered"
                                    AllowPaging="false" AllowSorting="false" EmptyDataText="No Data Found." OnRowDataBound="gvTemplate_RowDataBound">
                                    <Columns>
                                        <asp:BoundField DataField="strCategoryName" HeaderText="Group Name" />
                                        <asp:BoundField DataField="strTemplateName" HeaderText="Template Name" />
                                        <asp:TemplateField HeaderText="Template Body">
                                            <ItemTemplate>
                                                <div class="thumb" style="height: 160px; width: 140px">
                                                    <iframe frameborder="0" scrolling="no" height="150px" width="130px" style="text-align: left; vertical-align: top;" src='<%#Eval("strTemplateBody")%>'></iframe>
                                                </div>
                                            </ItemTemplate>
                                        </asp:TemplateField>
                                        <asp:BoundField DataField="dtCreatedDt" HeaderText="Created Date" />
                                        <asp:BoundField HeaderText="Action" ItemStyle-Width="170px" />
                                    </Columns>
                                </asp:GridView>

now all things data rendered properly to grid view like as below image :

enter image description here

here is TemplateBody which have html tags content. i just want to preview this to html preview format. just like as below image :

enter image description here


@Shalin Gajjar - Can you add this line in your project to the HTML convert from a string.

I have passed my Remarks field with HTML content. Also, I shared my HTML table "Remarks" column screenshot with simple HTML string content and after use "Server.HtmlDecode" this and show the textbox.

enter image description here enter image description here

<%# Server.HtmlDecode(Eval("Remarks").ToString()) %>