The requested page is not available for the requested platform. You are viewing the content for Default platform.

Localization

This document describes how to use JSON files from the DevExpress Localization Service to localize the Document Viewer and End-User Report Designer in ASP.NET Core applications.

Obtain JSON Files from the Localization Service

  1. Log into the DevExpress website.

  2. Open the DevExpress Localization Service.

  3. Select your target language, modify translations, and click the Download button. Refer to the Localization Service documentation topic for detailed information.

  4. Unpack the downloaded executable file to get the satellite assemblies and json resources directory. This directory contains the following JSON files required to localize the reporting controls (where xx is a culture name):

File Name

Localization Strings

dx-analytics-core.xx.json

Shared Components: Query Builder, Data Source Wizard, Filter Editor, Expression Editor

dx-reporting.xx.json

Web Document Viewer, End-User Report Designer and other reporting-specific components

Load JSON Files in a Razor-Based Application

Do the following if you have a .NET Razor-based ASP.NET Core application and use the ReportDesigner or WebDocumentViewer extension method:

  1. Copy the dx-analytics-core.xx.json and dx-reporting.xx.json files to the application directory (for instance, wwwroot).

  2. Open the View file and disable the ReportDesignerClientSideModelSettings.IncludeLocalization (or WebDocumentViewerClientSideModelSettings.IncludeLocalization) option not to load the default localization strings.

  3. Handle the client-side ReportDesignerClientSideEventsBuilder.CustomizeLocalization (or WebDocumentViewerClientSideEventsBuilder.CustomizeLocalization) event.

  4. In the event handler, use the argument's LoadMessages method to load JSON files to a reporting component.

<script type="text/javascript" id="script">
    function CustomizeLocalization(s, e) {
        e.LoadMessages($.get("/dx-analytics-core.de.json"))
        e.LoadMessages($.get("/dx-reporting.de.json"))
    } 
</script>

@(Html.DevExpress().ReportDesigner("reportDesigner")
    .ClientSideModelSettings(x => x.IncludeLocalization = false)
    .ClientSideEvents(x => x.CustomizeLocalization("CustomizeLocalization"))
    .Height("1000px")
    .Bind("Report")) 

Load JSON Files in an Angular-Based Application

Do the following if you use the dx-report-viewer/dx-report-designer Angular component and an ASP.NET Core application acts as a backend:

  1. Copy the dx-analytics-core.xx.json and dx-reporting.xx.json files to the application directory (for instance, wwwroot).

  2. Open a View (HTML file) and handle the CustomizeLocalization callback.

    <div>
    <dx-report-designer [reportUrl]="reportUrl" height="700px" [allowMDI]="allowMDI" cssClass='myDesigner'>
        <dxrd-request-options [getDesignerModelAction]="getDesignerModelAction" [host]="hostUrl"></dxrd-request-options>
        <dxrd-callbacks
            (CustomizeLocalization)="CustomizeLocalization($event)">
        </dxrd-callbacks>
    </dx-report-designer>
    </div>
    
  3. Open a View Model (TS file) and write the CustomizeLocalization event handler. Use the event argument's LoadMessages method to load JSON files to a reporting component.

    // ...
    import * as $ from "jquery";
    // ...
    
    export class AppComponent {
        // ...
        CustomizeLocalization(event) {
            event.args.LoadMessages($.get("/dx-analytics-core.de.json"));
            event.args.LoadMessages($.get("/dx-reporting.de.json"));
        } 
    }