Embedding widget with options
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-12-2017 02:51 PM
Hi Experts,
I'm trying to embed the chartjs-report widget found in the share site (ServiceNow Share ), but am running into issues with the options. When using chartjs widget on its own, the user has the ability to edit the title, report, report type, etc. in the Designer view:
However, when this widget is embedded in another widget, the ability to input options like above seems to go away. Based on the ServiceNow docs I've read, it looks like options need to be declared in the backend server script, but I'm not sure how to do that correctly (sorry, new to angular). If I'm following the syntax correctly, the HTML seems easy enough:
<sp-widget id="chartjs-report" options='data.chartOptions'></sp-widget>
But customizing the server script is a bit confusing for me:
(function() {
data.chartOptions = {"u_type": "Donut",
"title": "Headcount Chart",
"u_report": "active_headcount"};
})();
The above code doesn't work and I'm wondering if my chartOptions are correct. I got u_type and u_report by opening the above option screen in platform and then right clicking on the Report Type and Report fields to get their names. What am I doing wrong here?
Thanks!
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-12-2017 07:56 PM
This may help, depending on exactly what you're trying to do. I wanted to set the options on the embedded widget based on options I added to the "parent" widget.
I had to use client script in my embedded widget to get options from the parent:
If you're just talking about setting the options in the server script, like hardcoding them, it just looks like this:
options.title = "title";
options.short_description = "description";
If you've got values stored in the data object somewhere you could also do this (also in the server script)
options.title = data.name;
options.short_description = data.tagline;
etc, etc.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-12-2017 08:15 PM
Thanks Andrew! I just tried options.title = "title"; as you indicated, but it doesn't work. Am I supposed to include that in data.chartOptions? Like this...
data.chartOptions = {options.title = "title"};
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-13-2017 05:05 AM
That was just a generic example, you'll need to look at your widgets' Option Schema to know what the actual name of your widget's options are.
in the above example, the syntax would be:
options.max_group
and I'm not familiar with the syntax you're using in your example. I've never done it that way.