Custom Actions

To add custom actions to the Bold Reports® ASP.NET Web Forms Report Viewer, add user-defined buttons to the toolbar and invoke custom actions using the Report Viewer property. For example, you can create a custom email button that sends the rendered report to users.

How do I add an email button to the Report Viewer toolbar?

To add an email button to the ASP.NET Web Forms Report Viewer toolbar, define a custom toolbar item in the Page_Load() function and handle the toolbar item click event in the page.

  1. Create an email button in the toolbar using the CustomItems property with the values such as groupIndex, index, itemType, cssClass, and tooltip. The OnClientToolBarItemClick event triggers when you click the email button.

  2. Access the Report Viewer model and create a JSON array for sending requests to the Web API Server. Use the following codes to create an event with a custom action.

  3. Use the following code to add the email button in your application’s Page_Load() function using the ToolbarSettings property.

        protected void Page_Load(object sender, EventArgs e)
        {
            ToolbarSettings toolbarSettings = new ToolbarSettings();
            toolbarSettings.CustomItems = new List<CustomItem>();
    
            var customItem = new CustomItem()
            {
                GroupIndex = 1,
                Index = 1,
                CssClass = "e-icon e-mail e-reportviewer-icon",
                Type = BoldReports.ReportViewerEnums.ToolBarItemType.Default,
                Id = "E-Mail",
                Tooltip = new ToolTip() { Header = "E-Mail", Content = "Send rendered report as mail attachment" }
            };
    
            toolbarSettings.CustomItems.Add(customItem);
            this.viewer.ToolbarSettings = toolbarSettings;
        }
  4. Use the following code to create the OnClientToolBarItemClick event on the client side.

        <div style="height: 650px;width: 950px;min-height:404px;">
            <Bold:ReportViewer runat="server" ID="viewer"
                ReportServiceUrl="/api/ReportViewer"
                ReportPath="~/Resources/sales-order-detail.rdl" OnClientToolBarItemClick="onToolBarItemClick">
            </Bold:ReportViewer>
        </div>
    
        <script type="text/javascript">
            function onToolBarItemClick(args) {
                alert('Action Triggered');
            }
        </script>
  5. Use the following code to invoke custom actions using the custom email button on the client side.

        <div style="height: 650px;width: 950px;min-height:404px;">
            <Bold:ReportViewer runat="server" ID="viewer"
                ReportServiceUrl="/api/ReportViewer"
                ReportPath="~/Resources/sales-order-detail.rdl" OnClientToolBarItemClick="onToolBarItemClick">
            </Bold:ReportViewer>
        </div>
    
        <script type="text/javascript">
            function onToolBarItemClick(args) {
            if (args.value == "E-Mail") {
                    var proxy = $('#viewer').data('boldReportViewer');
                    var Report = proxy.model.reportPath;
                    var lastsIndex = Report.lastIndexOf("/");
                    var reportName = Report.substring(lastsIndex + 1);
                    var requrl = proxy.model.reportServiceUrl + '/SendEmail';
                    var _json = {
                        exportType: "PDF", reportViewerToken: proxy._reportViewerToken, ReportName: reportName
                    };
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: requrl,
                        data: JSON.stringify(_json),
                        dataType: "json",
                        crossDomain: true
                    })
                }
            }
        </script>

How do I send the report as an email attachment?

To send a report from the ASP.NET Web Forms Report Viewer as an email attachment, add a custom email action to the Web API service that exports the report to a stream and attaches it to a mail message.

  1. Create a new action method SendEmail in the Web API service.

  2. Export the report to the required type using the ReportHelper.GetReport method to send a report stream as an attachment.

  3. The following code sample exports the report to a stream and sends it as an attachment to a specified mail address. In the code, the SmtpClient method is used to send the report as an email attachment.

        public object SendEmail(Dictionary<string, object> jsonResult)
        {
            string _token = jsonResult["reportViewerToken"].ToString();
            var stream = ReportHelper.GetReport(_token, jsonResult["exportType"].ToString());
            stream.Position = 0;
    
            if (!ComposeEmail(stream, jsonResult["reportName"].ToString()))
            {
                return "Mail not sent !!!";
            }
    
            return "Mail Sent !!!";
        }
    
        public bool ComposeEmail(Stream stream, string reportName)
        {
            try
            {
                MailMessage mail = new MailMessage();
                SmtpClient SmtpServer = new SmtpClient("smtp.gmail.com");
                mail.IsBodyHtml = true;
                mail.From = new MailAddress("[email protected]");
                mail.To.Add("[email protected]");
                mail.Subject = "Report Name : " + reportName;
                stream.Position = 0;
    
                if (stream != null)
                {
                    ContentType ct = new ContentType();
                    ct.Name = reportName + DateTime.Now.ToString() + ".pdf";
                    System.Net.Mail.Attachment attachment = new System.Net.Mail.Attachment(stream, ct);
                    mail.Attachments.Add(attachment);
                }
    
                SmtpServer.Port = 587;
                SmtpServer.Credentials = new System.Net.NetworkCredential("[email protected]", "xx");
                SmtpServer.EnableSsl = true;
                SmtpServer.Send(mail);
    
                return true;
            }
            catch (Exception ex)
            {
                throw ex;
            }
    
            return false;
        }

    In the preceding code sample, the report is exported to PDF format and sent to users using the SmptClient method.