locked
Emailing the content of div tag RRS feed

  • Question

  • User-995741658 posted

    Hi,


    Im having a div tag containing grid and tables and labels.

    I want to email the whole content of div tag along with the image.

    But it is giving me error.

    Cannot get inner content of Invoice because the contents are not literal.

    Plz help

    Wednesday, February 17, 2010 10:33 AM

Answers

  • User1366835050 posted

    Hi,

    I got the same issue while testing with the same senario. I solved it by adding an hidden control and setting at the client side and while sending the mail I got the content of the div from the hidden control.

    The issue is happending because we are using Grid view inside of the div control and if we remove the Grid view and try to send the innerHTML given no error.

    Here is the code I solved the same senario, try it and let me know if any issues.

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="EMailDiv.aspx.cs" Inherits="EMailDiv" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Untitled Page</title>
        <script language="javascript" type="text/javascript">
            function AssignContent()
            {
                document.getElementById("hidContent").value =  document.getElementById('divForEMail').innerHTML.replace(/</g,'<').replace(/>/g,'>');
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <h2>Here is my normal content Starts</h2>
            <p>Some Paragraph text which does not required to send as email</p>
            <div id="divForEMail">
                <table>
                    <tr>
                        <td>
                            <table>
                                <tr>
                                    <td colspan="2">
                                    My Heading
                                    </td>
                                </tr>
                                <tr>
                                    <td>My Data</td>
                                    <td>My Data</td>
                                </tr>
                            </table>
                        </td>
                        <td>
                            <img alt="thismessagerequiredaserverimagecanaccessontheweb" src="http://imagerepository.com/img12345.gif" />
                        </td>
                    </tr>
                    <tr>  
                        <td colspan="2">
                            <asp:GridView ID="grdEmployeeDetails" runat="server" 
                                AllowPaging="True" AutoGenerateColumns="False"
                                BorderStyle="None" TabIndex="1" CssClass="GridViewStyle" Width="100%" 
                                DataSourceID="xmlEmployeeDetails">
                                <Columns>
                                    <asp:BoundField DataField="EmployeeID" HeaderText="Employee ID" SortExpression="EmployeeID">
                                        <ItemStyle Width="10%" Wrap="true" />
                                        <HeaderStyle Width="10%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="EmployeeName" HeaderText="Employee Name" SortExpression="EmployeeName" >
                                        <ItemStyle Width="30%" Wrap="true" />
                                        <HeaderStyle Width="30%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="Department" HeaderText="Department" SortExpression="Department" >
                                        <ItemStyle Width="15%" Wrap="true" />
                                        <HeaderStyle Width="15%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="ManagerName" HeaderText="Manager Name" SortExpression="ManagerName" >
                                        <ItemStyle Width="15%" Wrap="true" />
                                        <HeaderStyle Width="15%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="Date" HeaderText="Date" SortExpression="Date" >
                                        <ItemStyle Width="15%" Wrap="true" />
                                        <HeaderStyle Width="15%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="MainPhone" HeaderText="Main Phone" SortExpression="MainPhone" >
                                        <ItemStyle Width="15%" Wrap="true" />
                                        <HeaderStyle Width="15%" />
                                    </asp:BoundField>
                                </Columns>
                                <FooterStyle BackColor="#C6C3C6" ForeColor="Black" />
                                <EmptyDataTemplate>
                                    <p class="NoDataMessageStyle">No Records found</p>
                                </EmptyDataTemplate>
                                <RowStyle BackColor="#DEDFDE" ForeColor="Black" />
                                <SelectedRowStyle BackColor="#9471DE" Font-Bold="True" ForeColor="White" />
                                <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#E7E7FF" />
                                <PagerStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" HorizontalAlign="Right" />
                            </asp:GridView>
                            <asp:XmlDataSource ID="xmlEmployeeDetails" runat="server" DataFile="~/Employee.xml"></asp:XmlDataSource>
                        </td>
                    </tr>
                </table>
            </div>
            <asp:Button ID="btnEMail" runat="server" Text="E-Mail" OnClick="btnEMail_Click" OnClientClick="AssignContent()" />
            <asp:HiddenField ID="hidContent" runat="server" Value="" />
        </form>
    </body>
    </html>
    

    and in the code behind call the code like this..

     

    public partial class EMailDiv : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
    
        }
        protected void btnEMail_Click(object sender, EventArgs e)
        {
    
                SmtpClient smtp = new SmtpClient(SmtpServer);
                MailMessage mssg = new MailMessage();
                mssg.From = new MailAddress("");
                mssg.Subject = "';
                 //....................... remaining code goes here
                mssg.Body = Server.HtmlDecode(hidContent.Value); // we are decoding the html value by replacing the <, > symbols
                //......................... remaining code goes here
         }
    }


    Regards, Thirumalai M

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, February 18, 2010 1:40 AM

All replies

  • User645573348 posted

    what is giving you this error?
    can you give us some code to work with?

    Wednesday, February 17, 2010 11:57 AM
  • User-758443495 posted

    you can get the rendered text of the usercontrol in the render method

    put them inside a usercontrol and use :

     

    Dim stbOutput As New StringBuilder MyBase.Render(New HtmlTextWriter(New StringWriter(stbOutput))) Dim output As String = stbOutput.ToString

    
    


    the output string is the render of controls text

     

     

    Wednesday, February 17, 2010 12:23 PM
  • User-995741658 posted

    <div id="Invoice" runat="server">
        <asp:Panel ID="pnlInvoice" GroupingText="Order Invoice" runat="server">
        <table>
        <tr><td>
        <table><tr><td style="text-align:right;" colspan="2">
            <img alt="Kayaguru" width="70%" height="70%"  src="images/kayaguru_logo.jpg" />
        </td></tr>
        <tr><td>Invoice No. : </td>
        <td>
            <asp:Label ID="lblInvoiceNo" runat="server" Text="Label"></asp:Label></td></tr>
            <tr><td>Date : </td>
            <td>
                <asp:Label ID="lblDate" runat="server" Text="Label"></asp:Label></td>
            </tr>
        </table>
        
        </td></tr>
        <tr><td>
            <asp:Panel ID="pnlAddress" GroupingText="Shipping Details" runat="server">
              <asp:DetailsView ID="dvAddress" runat="server" Height="50px" Width="225px" AutoGenerateRows="False">
                <Fields>
                    <asp:BoundField DataField="Name" ReadOnly="True" HeaderText="Name" SortExpression="Name" />
                    <asp:BoundField DataField="Email" HeaderText="Email" ReadOnly="True" SortExpression="Email" />
                    <asp:BoundField DataField="Mobile" HeaderText="Mobile Number" ReadOnly="True" SortExpression="Mobile" />
                    <asp:BoundField DataField="Address" HeaderText="Address" ReadOnly="True" SortExpression="Address" />
                    <asp:BoundField DataField="Pincode" HeaderText="Pincode" ReadOnly="True" SortExpression="Pincode" />
                    <asp:BoundField DataField="City" HeaderText="City" ReadOnly="True" SortExpression="City" />
                    <asp:BoundField DataField="State" HeaderText="State" ReadOnly="True" SortExpression="State" />
                    <asp:BoundField DataField="Country" HeaderText="Country" ReadOnly="True" SortExpression="State" />
                </Fields>
            </asp:DetailsView>
            </asp:Panel>
        </td></tr>
        <tr><td>
            <asp:Panel ID="pnlOrderDetails" GroupingText="Order Details" runat="server">
             <asp:GridView ID="grdCart"  GridLines="Both" BorderColor="Black" BorderStyle="Solid" BorderWidth="1"  CssClass="mGrid" runat="server"
                AutoGenerateColumns="False" DataKeyNames="Product_Code">
                <Columns>
                    <asp:BoundField DataField="Product_Code" Visible="false" HeaderText="Product Code"
                        ReadOnly="True" />
                    <asp:BoundField DataField="Product" HeaderText="Product" ReadOnly="True" />
                    <asp:BoundField DataField="Price" HeaderText="Price" ReadOnly="True" />
                    <asp:BoundField DataField="Discount" HeaderText="Discount(%)" ReadOnly="True" />
                    <asp:BoundField DataField="Offer Price" HeaderText="Offer Price" ReadOnly="True" />
                    <asp:BoundField DataField="Tax" HeaderText="Tax Amount" ReadOnly="True" />
                    <asp:BoundField DataField="Shipping" Visible="false" HeaderText="Shipping Amount"
                        ReadOnly="True"/>
                    <asp:BoundField DataField="Quantity" HeaderText="Quantity" ReadOnly="True" />    
                   <asp:BoundField DataField="Sub Total" HeaderText="Sub Total" ReadOnly="True" />
                </Columns>
                <EmptyDataTemplate>
                    Your Shopping Cart is empty, add items
                </EmptyDataTemplate>
            </asp:GridView>
            <asp:Label ID="lblQty" runat="server"></asp:Label><br />
            <asp:Label ID="lblTotal" runat="server"></asp:Label>
           </asp:Panel>
             
        </td></tr>
        </table>
        </asp:Panel>
        </div>


    This is the div tag whose content i have to email.


     Protected Sub btnBuyNow_Click(ByVal sender As Object, ByVal e As System.Web.UI.ImageClickEventArgs) Handles btnBuyNow.Click
            ' Sending Order Mail to Customer 
            ObjComman.sendMyEmail("", dvAddress.Rows(1).Cells(1).Text, "Ebay", "Invoice of Shopping From Ebay", Invoice.InnerHtml)
        End Sub


    The error it is giving me is -Cannot get inner content of Invoice because the contents are not literal.

    Thursday, February 18, 2010 12:05 AM
  • User1366835050 posted

    Hi,

    I got the same issue while testing with the same senario. I solved it by adding an hidden control and setting at the client side and while sending the mail I got the content of the div from the hidden control.

    The issue is happending because we are using Grid view inside of the div control and if we remove the Grid view and try to send the innerHTML given no error.

    Here is the code I solved the same senario, try it and let me know if any issues.

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="EMailDiv.aspx.cs" Inherits="EMailDiv" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Untitled Page</title>
        <script language="javascript" type="text/javascript">
            function AssignContent()
            {
                document.getElementById("hidContent").value =  document.getElementById('divForEMail').innerHTML.replace(/</g,'<').replace(/>/g,'>');
            }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <h2>Here is my normal content Starts</h2>
            <p>Some Paragraph text which does not required to send as email</p>
            <div id="divForEMail">
                <table>
                    <tr>
                        <td>
                            <table>
                                <tr>
                                    <td colspan="2">
                                    My Heading
                                    </td>
                                </tr>
                                <tr>
                                    <td>My Data</td>
                                    <td>My Data</td>
                                </tr>
                            </table>
                        </td>
                        <td>
                            <img alt="thismessagerequiredaserverimagecanaccessontheweb" src="http://imagerepository.com/img12345.gif" />
                        </td>
                    </tr>
                    <tr>  
                        <td colspan="2">
                            <asp:GridView ID="grdEmployeeDetails" runat="server" 
                                AllowPaging="True" AutoGenerateColumns="False"
                                BorderStyle="None" TabIndex="1" CssClass="GridViewStyle" Width="100%" 
                                DataSourceID="xmlEmployeeDetails">
                                <Columns>
                                    <asp:BoundField DataField="EmployeeID" HeaderText="Employee ID" SortExpression="EmployeeID">
                                        <ItemStyle Width="10%" Wrap="true" />
                                        <HeaderStyle Width="10%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="EmployeeName" HeaderText="Employee Name" SortExpression="EmployeeName" >
                                        <ItemStyle Width="30%" Wrap="true" />
                                        <HeaderStyle Width="30%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="Department" HeaderText="Department" SortExpression="Department" >
                                        <ItemStyle Width="15%" Wrap="true" />
                                        <HeaderStyle Width="15%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="ManagerName" HeaderText="Manager Name" SortExpression="ManagerName" >
                                        <ItemStyle Width="15%" Wrap="true" />
                                        <HeaderStyle Width="15%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="Date" HeaderText="Date" SortExpression="Date" >
                                        <ItemStyle Width="15%" Wrap="true" />
                                        <HeaderStyle Width="15%" />
                                    </asp:BoundField>
                                    <asp:BoundField DataField="MainPhone" HeaderText="Main Phone" SortExpression="MainPhone" >
                                        <ItemStyle Width="15%" Wrap="true" />
                                        <HeaderStyle Width="15%" />
                                    </asp:BoundField>
                                </Columns>
                                <FooterStyle BackColor="#C6C3C6" ForeColor="Black" />
                                <EmptyDataTemplate>
                                    <p class="NoDataMessageStyle">No Records found</p>
                                </EmptyDataTemplate>
                                <RowStyle BackColor="#DEDFDE" ForeColor="Black" />
                                <SelectedRowStyle BackColor="#9471DE" Font-Bold="True" ForeColor="White" />
                                <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#E7E7FF" />
                                <PagerStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" HorizontalAlign="Right" />
                            </asp:GridView>
                            <asp:XmlDataSource ID="xmlEmployeeDetails" runat="server" DataFile="~/Employee.xml"></asp:XmlDataSource>
                        </td>
                    </tr>
                </table>
            </div>
            <asp:Button ID="btnEMail" runat="server" Text="E-Mail" OnClick="btnEMail_Click" OnClientClick="AssignContent()" />
            <asp:HiddenField ID="hidContent" runat="server" Value="" />
        </form>
    </body>
    </html>
    

    and in the code behind call the code like this..

     

    public partial class EMailDiv : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
    
        }
        protected void btnEMail_Click(object sender, EventArgs e)
        {
    
                SmtpClient smtp = new SmtpClient(SmtpServer);
                MailMessage mssg = new MailMessage();
                mssg.From = new MailAddress("");
                mssg.Subject = "';
                 //....................... remaining code goes here
                mssg.Body = Server.HtmlDecode(hidContent.Value); // we are decoding the html value by replacing the <, > symbols
                //......................... remaining code goes here
         }
    }


    Regards, Thirumalai M

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, February 18, 2010 1:40 AM
  • User-995741658 posted

    Thanx,

    I had done it,but you dont need to replace anything.

    this is my fuction


    function EmailInvoice(elementId)
    {
        document.getElementById('ctl00_ContentPlaceHolder1_hdnEmail').value = document.getElementById(elementId).innerHTML;
    }


    Thanx

    Thursday, February 18, 2010 4:31 AM
  • User820639650 posted

    @Thirumalai M:

    Thanks for that answer, it helped me a great deal (I've adapted it into my solution for generating a printout of partial HTML content in my Web page.

    Thanks!!

    Thursday, August 26, 2010 7:44 AM