ActiveReports 18 .NET Edition
Developers / Create Applications / Js Viewer Application / Predefined Export Settings
In This Topic
    Predefined Export Settings
    In This Topic

    The Export dialog with the export settings is build-in into the Js Viewer UI. You can easy configure the settings for a report reader to use as predefined export settings. 

    Enable/Disable Exports

    Not all exports are available by default, some exports are hidden. To enable/disable exports, you should use the availableExports setting as demonstrated below:

    index.html
    Copy Code
    const viewer = GrapeCity.ActiveReports.JSViewer.create({
        element: '#root',
        availableExports: ['Pdf', 'XlsxData'],
        // other properties
    });
    

    The following exports are available.

    • Pdf - available for Page/RDLX and Section reports.
    • Tiff - available for Page/RDLX and Section reports.
    • Xls - available for Page/RDLX and Section reports.
    • Xlsx - available for Page/RDLX and Section reports.
    • XlsxData - available for Page/RDLX reports. This export is hidden by default because it exports only tabular data.
    • Doc - available for Page/RDLX reports.
    • Docx - available for Page/RDLX reports.
    • Rtf - available for Section reports.
    • Mht - available for Page/RDLX and Section reports.
    • Csv - available for Page/RDLX reports.
    • CsvData - available for Page/RDLX reports. This export is hidden by default because it exports only tabular data.
    • TXT - available for Section reports.
    • JSON - available for Page/RDLX reports.
    • XML - available for Page/RDLX reports.
    • TextPrint - available for Page/RDLX reports. This export is hidden by default because it is a replacement for a special generic/text only printer driver from Windows.

    Pre-initialized Settings

    To specify export settings, you should use the defaultExportSettings as demonstrated below:

    index.html
    Copy Code
    const viewer = GrapeCity.ActiveReports.JSViewer.create({
        element: '#root',
        defaultExportSettings: {
        xls: {
          enableToggles: {
            value: true,
            visible: false
          },
          sheetName: {
            value: ‘report’
          }
        }
      },
        // other properties
    });
    

    Customizing Export Settings

    Excel 2003 (.xls)

    Name Type Description
    Both rdlx and rpx
    MultiSheet Boolean

    Indicate whether to generate single-sheet or multi-sheet Excel document. Default for rpx is 'false' and rdlx is 'true'.

    SheetName String The name of the Excel sheet. Default is 'Sheet'.
    UseDefaultPalette Boolean

    Indicate whether to export the Excel document with Excel default palette.

    Remark:

    Setting this value to true, the application will use the color which is in default palette and is closest to pre-defined custom color of the control's fore color and back color. Default is 'false'.

    Orientation Default|Portrait|Landscape The orientation of the Excel document pages, to be printed in portrait or landscape.
    PaperSize Default|Letter|LetterSmall|Tabloid|
    Ledger|Legal|Statement|Executive|
    A3|A4|A4Small|A5|B4|B5
    Size of the Excel document.
    Password String The password required to open the Excel document.
    ProtectedBy String User Name responsible to password protect the Excel document.
    ReadOnlyRecommended Boolean

    Indicate if the Excel document was saved as read only recommended. Default is 'false'.

    WritePassword String The password required to edit the document.
    FileName String Name of the Excel document.
    Only rpx
    FileFormat Xls97Plus|Xls95 The file format version the exported Excel document should support. Default is 'Xls97Plus'.
    AutoRowHeight Boolean Indicate whether to set the row heights in the Excel document according to the content in the rows. Choose carefully since it may affect pagination. Default is 'false'.
    DisplayGridLines Boolean Indicate whether to display grid lines in the Excel document. Default is 'true'.
    Pagination Boolean Indicate if pagination should be used for the resulting Excel document. Default is 'true'.
    Only rdlx
    EnableToggles Boolean Indicate whether to export toggles from table details or groups to collapsible rows. Default is 'false'. This setting is applicable when Pagination is set to 'false'.
    LayoutMode Galley|Paginated The layout mode to use for the exported Excel document.
    RightToLeft Boolean Indicate whether to show the mirror image of sheets, that is, if sheets should be exported right to left. Note that content is not mirrored. Default is 'false'.

    Customizing .xls Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                       
                        xls: {
                            /* only rdlx */
                            EnableToggles: { value: true },
                            LayoutMode: { value: 'Galley' },
                            RightToLeft: { value: true },
                            /* only rpx */
                            FileFormat: { value: 'Xls95' },
                            AutoRowHeight: { value: true },
                            DisplayGridLines: { value: true },
                            Pagination: { value: false },
                            /* both (rdlx and rpx) */
                            MultiSheet: { value: false },
                            SheetName: { value: 'Sheet_xls' },
                            UseDefaultPalette: { value: true },
                            Orientation: { value: 'Landscape' },
                            PaperSize: { value: 'A5' },
                            Password: { value: '123456' },
                            ProtectedBy: { value: 'USER' },
                            ReadOnlyRecommended: { value: true },
                            WritePassword: { value: '123456' },
                            FileName: { value: "ar" }
                        },
                    }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>
    

    Excel (.xlsx)

    Name Type Description
    Both rdlx and rpx
    MultiSheet Boolean Indicate whether to generate single-sheet or multi-sheet Excel document. Default for rpx is 'false' and rdlx is 'true'.
    SheetName String The name of the Excel sheet. Default is 'Sheet'.
    UseDefaultPalette Boolean

    Indicate whether to export the Excel document with Excel default palette.

    Remark:

    Setting this value to true, application will use the color which is in default palette and is closest to the predefined custom color of the control's fore color and back color. Default is 'false'.

    OutputFormat Transitional|Strict
    UseCompression Boolean Indicate whether to use compression on exporting with Xlsx file format. Default is 'true'.
    Orientation Default|Portrait|Landscape The orientation of the Excel document pages, to be printed in portrait or landscape.
    PaperSize Default|Letter|LetterSmall|Tabloid|
    Ledger|Legal|Statement|Executive|
    A3|A4|A4Small|A5|B4|B5
    Size of the Excel document.
    Password String The password required to open the Excel document.
    ProtectedBy String User Name responsible to password protect the Excel document.
    ReadOnlyRecommended Boolean Indicate if the Excel document was saved as read-only recommended. Default is 'false'.
    WritePassword String The password required to edit the document.
    FileName String The name of the Excel document.
    Only rpx
    AutoRowHeight Boolean Indicate whether to set the row heights in the Excel document according to the content in the rows. Choose carefully since it may affect pagination. Default is 'false'
    DisplayGridLines Boolean Indicate whether to display grid lines in the Excel document. Default is 'true'.
    Pagination Boolean Indicate if pagination should be used for resulting Excel document. Default is 'true'.
    OpenXmlStandard Transitional (default)|Strict The level of Open XML document conformance on exporting in Xlsx file format. The Excel document generated using Strict cannot be viewed on iOS devices.
    Only rdlx
    EnableToggles Boolean Indicate whether to export toggles from table details or groups to collapsible rows. Default is 'false'.
    LayoutMode Galley|Paginated The layout mode to use for the exported Excel document.
    RightToLeft Boolean Show sheets right to left to show mirror image of sheets. Note that content is not mirrored. Default is 'false'.

    Customizing .xlsx Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                       
                      xlsx: {
                          /* only rdlx */
                          EnableToggles: { value: true },
                          LayoutMode: { value: 'Galley' },
                          RightToLeft: { value: true },
                          OutputFormat: { value: 'Strict' },
                          /* only rpx */
                          AutoRowHeight: { value: true },
                          DisplayGridLines: { value: false },
                          Pagination: { value: false },
                          OpenXmlStandard: { value: 'Strict' },
                          /* both (rdlx and rpx) */
                          MultiSheet: { value: false },
                          SheetName: { value: 'Sheet_xls' },
                          UseDefaultPalette: { value: true },
                          OutputFormat: { value: 'Strict' },
                          UseCompression: { value: false },
                          Orientation: { value: 'Landscape' },
                          PaperSize: { value: 'A5' },
                          Password: { value: '123456' },
                          ProtectedBy: { value: 'USER' },
                          ReadOnlyRecommended: { value: true },
                          WritePassword: { value: '123456' },
                          FileName: { value: "ar" }
                      },
                    }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>
    

    Word 2003 (.doc)

    Export to Word 2003 is available for Page and RDLX reports only.

    Name Type Description
    Author String The name of the author of the Word document.
    BaseHref String The Base Url for the relative hyperlinks used in the Word document.
    Generator String The identity of the generator of the Word document.
    PageHeight Integer The height of the page of the Word document.
    PageWidth Integer The width of the page of the Word document
    Title String The title of the Word document.
    FileName String The name of the Word document.

    Customizing .doc Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
     <html lang="en">
    <head>
         <meta charset="utf-8">
         <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
         <meta name="theme-color" content="#000000">
         <title>JS Viewer</title>
         <link href="jsViewer.min.css" rel="stylesheet">
         <link href="index.css" rel="stylesheet">
     </head>
    <body onload="loadViewer()">
         <div style="width: 100%">
             <div id="viewerContainer"></div>
         </div>
         <script type="text/javascript" src="jsViewer.min.js"></script>
         <script type="text/javascript">
             let viewer;
            function loadViewer() {
                 viewer = GrapeCity.ActiveReports.JSViewer.create({
                     element: '#viewerContainer',
                    defaultExportSettings: {
                       
                      doc: {
                          Author: { value: 'USER', visible: true },
                          BaseHref: { value: 'www.com' },
                          Generator: { value: 'Created by USER' },
                          PageHeight: { value: '10' },
                          PageWidth: { value: '5' },
                          Title: { value: 'TITLE_01' },
                          FileName: { value: 'ar_doc', visible: true }
                      },
                    }
                });
                 viewer.openReport("DemoReport.rdlx");
             }
         </script>
     </body>
     </html>
    

    Word (.docx)

    Export to Word is available for Page and RDLX reports only.

    Name Type Description
    Author String The name of the author of the Word document that appears in Word document properties.
    CompanyName String The name of the company to appear in the Word document properties.
    DocumentCompatibilityVersion Word2007|Word2010|Word2013 (default) The version in which the Word document should open.
    DpiX Integer The horizontal resolution of the custom report items. Default is '96'.
    DpiY Integer The vertical resolution of the custom report items. Default is '96'.
    Title String The title of the Word document that appears in the Word document properties.
    TOCAutoUpdate Boolean Indicate whether macros are inserted in the document to automatically update the TOC control on opening the Word document. Default is 'false'.
    Orientation Default|Portrait|Landscape The orientation of the Word document.
    PaperSize Default|Letter|LetterSmall|Tabloid|
    Ledger|Legal| Statement|Executive|
    A3|A4|A4Small|A5|B4|B5
    The size of the Word document.
    Password String The password required to open the document.
    ReadOnlyRecommended Boolean Indicate if the Word document was saved as read only recommended. Default is 'false'.
    WritePassword String The password required to edit the Word document.
    FileName String The name of the Word document.

    Customizing .docx Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                        docx: {
                            Author: { value: 'USER' },
                            CompanyName: { value: 'USER_COMPANY' },
                            DocumentCompatibilityVersion: { value: 'Word2010' },
                            DpiX: { value: 80 },
                            DpiY: { value: 80 },
                            Title: { value: 'TITLE_01' },
                            TOCAutoUpdate: { value: true },
                            Orientation: { value: 'Portrait' },
                            PaperSize: { value: 'B4' },
                            Password: { value: '123456' },
                            ReadOnlyRecommended: { value: true },
                            WritePassword: { value: '123456' },
                            FileName: { value: 'ar_doc' }
                        },
                    }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>
    

    PDF (.pdf)

    Name Type Description
    Both rdlx and rpx
    Title String The title of the PDF document that appears in the document meta data.
    Author String The name of the author of the PDF document that appears in the document meta data.
    Subject String The subject of the PDF document displayed that appears in the document meta data.
    Keywords String The keywords associated with the document that appear as the document meta data.
    Application String The string value for the 'Application' field that appears in the document meta data.
    EmbedFonts Partial (default)|All|None Indicate how the fonts used in the report should be embedded in the PDF document.
    Version

    Pdf12|Pdf13|Pdf14 (default)|Pdf15|
    Pdf16|Pdf17|Pdf20|PdfA1a|PdfA1b|PdfA2a|
    PdfA2b|PdfA2u|PdfA3a|PdfA3b|PdfA3u|PdfUA1

    The version of the PDF format the exported document is saved in.
    UserPassword String The password required to open the document.
    OwnerPassword String The owner password to be entered in the PDF reader that permits full access to the document regardless of the specified user permissions
    Encrypt Boolean The value indicating whether the document is encrypted or not. Default is 'false'.
    FileName String The name of the PDF document.
    Only rpx
    ConvertMetaToPng Boolean Indicate whether Windows metafiles are converted to PNG files in the exported PDF document. Default is 'false'.
    ExportBookmarks Boolean Indicate whether bookmarks are exported to the PDF document. Default is 'true'.
    ImageInterpolation None (default)| Auto The image interpolation value.
    ImageQuality Medium (default)|Lowest|Highest The quality used for any images that are converted by ActiveReports. Note that if a JPG image is used in the report, it is written directly to PDF without any conversion. Other image formats may incur a conversion, which this value will affect.

    Customizing .pdf Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                        pdf: {
                            /*only for rpx*/
                            ConvertMetaToPng: { value: true },
                            ExportBookmarks: { value: false },
                            ImageInterpolation: { value: 'Auto' },
                            ImageQuality: { value: 'Highest' },
                            /*both (rdlx and rpx)*/
                            Title: { value: 'Document' },
                            Author: { value: 'USER' },
                            Subject: { value: 'PDF' },
                            Keywords: { value: 'PDF export' },
                            Application: { value: 'AR' },
                            EmbedFonts: { value: 'All' },
                            Version: { value: 'Pdf15' },
                            UserPassword: { value: 'user_pwd' },
                            OwnerPassword: { value: 'owner_pwd' },
                            Encrypt: { value: true },
                            FileName: { value: 'ar_pdf', visible: true }
                        },
                    }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>
    

    CSV (.csv)

    Export to CSV is available for Page and RDLX reports only.

    Name Type Description
    ColumnsDelimiter (default)|. The text to be placed between fields in data row.
    Encoding Unicode (UTF-8)(default)|US-ASCII|Unicode The encoding schema for the output.
    NoHeader Boolean Indicate whether CSV Header should be omitted. Default is 'false'.
    QuotationMode Auto quote (default)|Always quote The quotations to be added on the exported values, whether to quote only simple values or all exported values.
    QuotationSymbol " (default)|\ The quotation symbol or the qualifier character to put around the results.
    RowsDelimiter \r\n (default)|\\r\\n\\r\\n

    The string to be placed between data rows.

    DateTimeFormat String

    Default format for date time values, for example 'MM/dd/yyyy H:mm'.

    NumericFormat String Default format for numeric values, for example '0.####'.
    FileName String The name of the CSV document.

    Customizing .csv Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                        csv: {
                            ColumnsDelimiter: { value: '.' },
                            Encoding: { value: 'Unicode' },
                            NoHeader: { value: true },
                            QuotationMode: { value: "Always quote", visible: true },
                            QuotationSymbol: { value: '\'' },
                            RowsDelimiter: { value: '\\r\\n\\r\\n' },
                            DateTimeFormat: { value: 'MM/dd/yyyy H:mm' },
                            NumericFormat: { value: 'money' },
                            FileName: { value: 'ar_csv' }
                        },
                    }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>
    

    JSON (.json)

    Export to JSON is available for Page and RDLX reports only.

    Name Type Description
    Formatted Boolean Indicate if the file name should be formatted with tabs and spaces for readability. Default is 'true'.
    QuotePropertyNames Boolean Indicate if the property names should be enclosed in quotation marks. Default is 'false'.
    FileName String The name of the JSON document.

    Customizing .json Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                        json: {
                            Formatted: { value: false },
                            QuotePropertyNames: { value: true },
                            FileName: { value: 'ar_json' }
                        },
                    }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>
    

    XML (.xml)

    Export to XML is available for Page and RDLX reports only.

    Name Type Description
    Encoding UTF-8 (default)|ASCII|Unicode The encoding schema for the output.
    FileName String The name of the XML document.

    Customizing .xml Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                        xml: {
                            Encoding: { value: 'Unicode' },
                            FileName: { value: 'ar_xml' }
                        },
                    }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>
    

    Tagged Image (.tiff)

    Name Type Description
    Both rpx and rdlx
    Dither Boolean The encoding schema for the output. Default is 'false'.
    DpiX Integer The horizontal resolution of the rendered images. Default is '200'.
    DpiY Integer The vertical resolution of the rendered images. Default is '196'.
    FileName String The name of the TIFF image.
    Only rpx
    Pagination Boolean Indicate if pagination should be used, that is, whether to render the entire report as a single image or each page of the report as separate images. Default is 'true'.
    CompressionScheme Ccitt3 (default)| None | Rle | Ccitt4 | Lzw The type of compression scheme to use for the reports rendered as TIFF images.
    Only rdlx
    Compression Ccitt3 (default)| None | Rle | Ccitt4 | Lzw The type of compression to use for the reports rendered as TIFF images.

    Customizing .tiff Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                      tiff: {
                          /* only for rpx */
                          Pagination: { value: false },
                          CompressionScheme: { value: 'None' },
                          /* only for rdlx */
                          Compression: { value: 'None' },
                          /*both (rdlx and rpx)*/
                          Dither: { value: true },
                          DpiX: { value: 150 },
                          DpiY: { value: 140 },
                          FileName: { value: 'ar_tiff' }
                       },
                    }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>
    

    RTF (.rtf)

    Export to RTF is available for Section Report only.

    Name Type Description
    EnableShapes Boolean Indicate whether to export the Shapes and Lines to RTF format. You will require Microsoft Word to view them correctly. Default is 'false'.
    Pagination Boolean Indicate if the property names should be enclosed in quotation marks. Default is 'true'.
    FileName String The name of the RTF document.

    Customizing .rtf Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                        rtf: {
                            EnableShapes: { value: true },
                            Pagination: { value: false },
                            FileName: {
                                value: 'ar_mht'
                            }
                        },
                    }
                });
                viewer.openReport("Invoice.rpx");
            }
        </script>
    </body>
    </html>
    

    Web Archive (.mht)

    Name Type Description
    Both rpx and rdlx
    FileName String The name of the MHT document.
    Only rpx
    BookmarkStyle Html (default) | None

    Specify Html to generate bookmarks if the report has the bookmarks.


     

    CharacterSet UnicodeUtf8 (default) | Big5 | EucJp | HzGb2312 | Ibm850 | Iso2022Jp | 
    Iso8859_1 | Iso8859_2 | Iso8859_5 | Iso8859_6 | Koi8r | ShiftJis | UnicodeUtf16
    The character set encoding to use for the outputted HTML pages. This property only takes effect if the IncludeHtmlHeader property is set to 'true'
    CreateFramesetPage Boolean Indicate whether to generate a set of frames that display a page of bookmarks (if available) in the left frame and the report document in the right frame. The HTML output uses the specified filename with the extension .frame.html. Default is 'false'.
    IncludeHtmlHeader Boolean Indicate whether to embed the HTML output in another HTML document. Otherwise, the HTML output includes the usual HTML, HEAD, and BODY elements. Default is 'true'.
    IncludePageMargins Boolean Indicate whether to include the report margins in the HTML output. Default is 'false'.
    MultiPage Boolean Indicate whether to generate multiple HTML pages for the document. Default is 'false'.
    OutputType DynamicHtml (default) | LegacyHtml The type of HTML output.
    Pagination Indicate whether to use pagination in the HTML output. Default is 'true'.

    RemoveVerticalSpace

    Indicate whether to remove empty vertical space from the output. Default is 'false'.
    Title The tile used in the HEAD of the HTML pages.
    Only rdlx
    Fragment Indicate whether to return only the contents inside the body tags so that you can embed it on the Web page. False returns the full HTML text.
    OutputTOC Indicate if the table of contents should be included in the output if it is available in the report. Default is 'true'.
    LinkTarget _blank (default) | [window_name]: _self | _parent | _top

    The value for a target for hyperlinks contained inside the report. A value of

    • _blank opens a new window
    • _self opens the same window
    • _top opens the new page to load in the full body of the window
    • _parent similar to '_top' but refers to the immediate parent of a frame in case of nested frames
    Mode Paginated (default) | Galley

    The layout mode to use for the exported document.

    • Paginated renders each page as a section inside the HTML document with Page headers and footers.
    • Galley renders one page with a single page header and footer.

    Customizing .mht Export Settings

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
             let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
                      mht: {
                          /* only for rdlx */
                          Fragment: { value: true },
                          OutputTOC: { value: false },
                          LinkTarget: { value: '_top' },
                          Mode: { value: 'Galley' },
                          /* only for rpx */
                          BookmarkStyle: { value: 'None' },
                          CharacterSet: { value: 'Big5' },
                          CreateFramesetPage: { value: true },
                          IncludeHtmlHeader: { value: false },
                          IncludePageMargins: { value: true },
                          MultiPage: { value: true },
                          OutputType: { value: 'LegacyHtml' },
                          Pagination: { value: false },
                          RemoveVerticalSpace: { value: true },
                          Title: { value: 'TITLE_01' },
                          /*both (rdlx and rpx)*/
                          FileName: { value: 'ar_mht' }
                      },
                     }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>
    

     

    Hide Export Settings

    To hide an export setting, you need to specify the visible property as 'false' along with the value property.

    For example. the following code hides all the .doc export settings.

    index.html
    Copy Code
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="theme-color" content="#000000">
        <title>JS Viewer</title>
        <link href="jsViewer.min.css" rel="stylesheet">
        <link href="index.css" rel="stylesheet">
    </head>
    <body onload="loadViewer()">
        <div style="width: 100%">
            <div id="viewerContainer"></div>
        </div>
        <script type="text/javascript" src="jsViewer.min.js"></script>
        <script type="text/javascript">
            let viewer;
            function loadViewer() {
                viewer = GrapeCity.ActiveReports.JSViewer.create({
                    element: '#viewerContainer',
                    defaultExportSettings: {
    /*hide all doc export settings*/
                      doc: {
                          Author: { value: 'USER', visible: false },
                          BaseHref: { value: 'www.com', visible: false },
                          Generator: { value: 'Created by USER', visible: false },
                          PageHeight: { value: '10', visible: false },
                          PageWidth: { value: '5', visible: false },
                          Title: { value: 'TITLE_01', visible: false },
                          FileName: { value: 'ar_doc', visible: false }
                      },
                    }
                });
                viewer.openReport("DemoReport.rdlx");
            }
        </script>
    </body>
    </html>