ClipboardSeparator Function

Specifies a character sequence that separates values of selected bricks when copied to the clipboard.

Declaration

export const ClipboardSeparator: DevExpress.Analytics.Internal.IGlobalSubscribableValue<string>

Parameters

Name	Type	Description
newVal	string	Any character or character sequence.

Returns

Type	Description
string	Any character or character sequence.

Remarks

The default value is an empty string. The following code snippets set the ClipboardSeparator value to \t in different applications. Tab-separated content can be easily inserted into an Excel file with each brick value in a separate cell.

ASP.NET Core

<script type="text/javascript">
    function onBeforeRender() {
        DevExpress.Reporting.Viewer.Settings.ClipboardSeparator('\t');
    }
</script>
@{
    var viewerRender = Html.DevExpress().WebDocumentViewer("DocumentViewer")
        .Height("100%")
        .ClientSideEvents(configure => configure.BeforeRender("onBeforeRender"))
        .Bind(Model);
    @viewerRender.RenderHtml()
}

ASP.NET MVC

<script type="text/javascript">
    function onBeforeRender() {
        DevExpress.Reporting.Viewer.Settings.ClipboardSeparator('\t');
    }
</script>

@Html.DevExpress().WebDocumentViewer(settings =>
{
    settings.Name = "WebDocumentViewer1";
    settings.ClientSideEvents.BeforeRender= "onBeforeRender";
}).Bind(Model).GetHtml()

ASP.NET Web Forms

<script type="text/javascript">
    function onBeforeRender() {
        DevExpress.Reporting.Viewer.Settings.ClipboardSeparator('\t');
    }
</script>
<dx:ASPxReportDesigner ID="ASPxReportDesigner1" runat="server">
    <ClientSideEvents BeforeRender="onBeforeRender"/>
</dx:ASPxReportDesigner>

Blazor (JavaScript-based Document Viewer)

DocumentViewer.razor

@page "/documentviewer"

<DxDocumentViewer ReportName="XtraReport1" Height="calc(100vh - 130px)" Width="100%">
    <DxDocumentViewerCallbacks BeforeRender="viewer.onBeforeRender" />
</DxDocumentViewer>

reporting_ViewerCustomization.js

window.viewer = {
    onBeforeRender: function (s, e) {
        DevExpress.Reporting.Viewer.Settings.ClipboardSeparator('\t');
    }
};

Reference the reporting_ViewerCustomization.js file in the _Host.cshtml page.

Angular

app.component.ts

import { ClipboardSeparator } from 'devexpress-reporting/dx-webdocumentviewer'
// ...
export class AppComponent {
    title = 'DXReportViewerSample';
    reportUrl: string = 'Products';
    hostUrl: string = 'https://localhost:5000/';
    invokeAction: string = "/WebDocumentViewer/Invoke";

    onBeforeRender() {
        ClipboardSeparator('\t');
    }
}

app.component.html

<dx-report-viewer [reportUrl]="reportUrl" height="800px">
    <dxrv-request-options [invokeAction]="invokeAction" [host]="hostUrl"/>
    <dxrv-callbacks (BeforeRender)="onBeforeRender($event)" />
</dx-report-viewer>

React

'use client';
import { ClipboardSeparator} from 'devexpress-reporting/dx-webdocumentviewer'
//...

function App() {
  const viewerRef = React.useRef<DxReportViewerRef>();
  const onBeforeRender = (event: any): void => {
        ClipboardSeparator('\t');
  };
  const exportDocument = () => viewerRef.current?.instance().ExportTo('xlsx');
  return (
    <>
      <ReportViewer ref={viewerRef} reportUrl="TestReport">
        <RequestOptions host="http://localhost:5000/" invokeAction="/DXXRDV" />
        <Callbacks BeforeRender={onBeforeRender} />
      </ReportViewer>
    </>
  )
}

export default App