Skip to main content

Embedding Without JavaScript

This applies to: Managed Dashboards, Managed Reports

This method is a quick and simple way of embedding Symphony that doesn't require any JavaScript, and uses the embed library as an alternative to creating an iframe element yourself and setting its URL. Add this HTML markup to your page or generate it in your server-based web application with the required information specified as attributes.

The following example embeds a Symphony instance located at https://placeholder.dundas-bi-url.com, and a dashboard with the specified ID:

... <head> <script src="/Scripts/Embed/dundas.embed.min.js" type="text/javascript" ></script> </head> ... <body> <div class="dundas-bi-embed" data-dundas-bi-url="https://placeholder.dundas-bi-url.com/" data-controller-type="Dashboard" data-file-system-id="727ae6b6-b5b6-4c1e-bcd7-72561000098d"> </div> </body>
Note: This element must be added to the page before the browser's DOMContentLoaded event fires to embed Symphony without JavaScript.

The following table describes the HTML attributes that can be used when embedding without JavaScript:

AttributeDescription
class

The class must be set to dundas-bi-embed to become a valid Symphony embedded application object.

data-dundas-bi-url

The base URL pointing to the installed Symphony instance. For example: https://sym.example.com:8000/

data-controller-type

The type of object you are embedding, which will normally match the portion of a Dundas BI URL for that object immediately following the base URL. Options include: Dashboard, Scorecard, Report, SmallMultiple, Slideshow, Shortlink, MetricSet, DataCube, CubePerspective, Hierarchy, Admin, Home.

Optional.

data-file-system-id

The ID of an existing file you want to embed if data-controller-type is set to a file type such as a dashboard or metric set. This can be left unset to create a new file of that type.

Optional.

data-shortlink

The short link value following the /Link/?shortLink= portion of the link (such as ae6swdok5p5r0mm3m4oagueuwo) if data-controller-type is Shortlink, for example when using a shared link.

data-logon-token-id

The logon token ID (populated using code).

Optional.

data-session-token

The session token (populated using code).

Optional.

data-view-options

The view options when displaying a view such as a dashboard. The following are the possibilities: menuonly, menutoolbar, menutoolbartaskbar, none, toolbaronly, or viewonly. By default, viewonly is used when you specify the ID of an existing view. This can be left unset for a shortlink to use the view options chosen when creating the shortlink.

Optional.

data-parametervalue-1

The way to set view parameter values for a view such as a dashboard. You can use multiple of these attributes by increasing their number (data-parametervalue-2, data-parametervalue-3, etc.) The values are in a similar format as when passed via query string, such as viewParameter2=$Today$.

Optional.

data-urlparameteroption-1

The way to add other URL parameters. You can use multiple of these attributes by increasing their number (data-urlparameteroption-2, data-urlparameteroption-3, etc.) For example, cultureName=fr-FR, or e=true to open a dashboard in edit mode.

Optional.

The following example embeds the Symphony instance located at https://placeholder.dundas-bi-url.com, displaying the dashboard with the specified ID. It will log on automatically with the specified logon token, set two view parameters, and set the culture to fr-FR:

... <head> <script src="/Scripts/Embed/dundas.embed.min.js" type="text/javascript" ></script> </head> ... <body> <div class="dundas-bi-embed" data-dundas-bi-url="https://placeholder.dundas-bi-url.com/" data-controller-type="Dashboard" data-file-system-id="727ae6b6-b5b6-4c1e-bad7-72561040298d" data-logon-token-id="13ECB6B5-8324-473B-BCA5-6D18E2DC3988" data-parametervalue-1="viewParameter2=$Today$" data-parametervalue-2="viewParameter4=2500~3700" data-urlparameteroption-1="cultureName=fr-FR"> </div> </body>

User Log On Options

There are a few options to choose from for how your users will be logged onto Symphony:

Single Sign-On - To allow your users to be logged into Symphonyautomatically, use one of the various options described in the article Single sign-on (SSO).

Server-side code - A logon token or session token can be specified in the HTML as shown in the example markup above by code that runs at the server to retrieve it for each user that logs on. See the viewer integration sample web application for an example, and the section about embedding in the article Single sign-on (SSO) for more information.

Manual log on - If a single sign-on option is not used and a valid logon or session token is not specified, users will be prompted to log on before they can navigate to the specified dashboard or file.

Was this article helpful?

We're sorry to hear that.

Powered by Zendesk