Drill Down For SP List

Dashboard Designer SharePoint 2013/2016, Office 365 versions
1

Good evening,

Currently I am using your example code for drill down purposes and it works smoothly, however, when it applies the filter, it adds to (with a checked box) “Undefined” to the filter list, and so nothing is shown on the filter. It does not seem to check the category I select on the series. I use only 1 view on this page.

Also, is there a way I can apply the filters if I want to change the Style of the view? The filter does not seem to be responsive if I apply a Style change to, for example, Basic List.

I use the following code:

var handlers = {};
handlers.preRender = function (config, logger) {
logger.debug('Configuration: ', config);

config.chartArea = {background: "transparent"};

config.valueAxis.labels.color = "white";
config.valueAxis.labels.font = "12px Helvetica,Helvetica,Helvetica";

config.categoryAxis.labels.color = "white";
config.categoryAxis.labels.font = "12px Helvetica,Helvetica,Helvetica";

config.series[0].labels = {};
config.series[0].labels.color = "white";
config.series[0].labels.font = "12px Helvetica,Helvetica,Helvetica";
config.series[0].color = '#85bb65';

config.categoryAxis.labels.rotation = -25;

[color=#0040FF]var filtrationApplied = false;

config.plotAreaClick = function (e) {
    if (!filtrationApplied) {
        window.location.hash = '';
    }

    filtrationApplied = false;
}

config.seriesClick = function (e) {
    if (ctx && ctx.clvp) {
        var filter =
          'FilterField1=Contact-FilterValue1=' + e.dataItem.Contact; 

        window.location.hash = '#InplviewHash' +
        ctx.clvp.wpid + '=' + encodeURIComponent(filter);

        filtrationApplied = true;
    }[/color]


}

return true;

}

Thank you kindly for any guidance.

2

window.location.hash = ‘#InplviewHash’ +

This was an error, as I was not using the hash mark in the code when running.

3

The URL reads as follow:

/estimating/Lists/Bid%20Log%20Test/Recent%20Awards.aspx#InplviewHash4a5608fb-d85e-4faa-bd16-4c1f1fe70902=FilterField1%3DContact-FilterValue1%3Dundefined

For some reason it adds undefined to the end. If I add the Contact name manually in place of “undefined”, it will filter as intended.

I hope this helps!

4

It seems that ‘e.dataItem.Contact’ field is undefined. Make sure that the internal name is Contact and that you picked this field in the first tab in Dashboard Designer.

5

I appreciate the feedback. I have verified that internal name and it does filter the list to the field correctly, but the value still comes up as undefined. If I replace “undefined” in the URL with the name of the series category manually, it filters perfectly. It looks like there is an issue with FilterValue1. It’s probably right in front of me I just haven’t put my finger on it yet.

6

Could you drop a template of your list with data and the chart’s configuration to support@spchart.com?

7

As requested, I’ve sent the files to support@spchart.com. Thank you for the help.

8

Hi!
First, add an extra aggregation in DataSource -> Aggregation: 'Contact' = 'min' of 'Client':

Untitled.png944×426 12.3 KB

Then replace your code with this in Dashboard -> Advanced:


var handlers = {};

handlers.preRender = function (config, logger) {

    logger.debug('Configuration: ', config);


    config.chartArea = {background: "transparent"};

 

    config.valueAxis.labels.color = "white";

    config.valueAxis.labels.font = "12px Helvetica,Helvetica,Helvetica";

 

    config.categoryAxis.labels.color = "white";

    config.categoryAxis.labels.font = "12px Helvetica,Helvetica,Helvetica";

 

    config.series[0].labels = {};

    config.series[0].labels.color = "white";

    config.series[0].labels.font = "12px Helvetica,Helvetica,Helvetica";

    config.series[0].color = '#85bb65';

 

    config.categoryAxis.labels.rotation = -25;

 

var filtrationApplied = false;


    config.plotAreaClick = function (e) {

        if (!filtrationApplied) {

            window.location.hash = '';

        }


        filtrationApplied = false;

    }


    config.seriesClick = function (e) {

        if (ctx && ctx.clvp) {

            var filter =

              'FilterField1=Contact-FilterValue1=' + e.dataItem.Contact;


            window.location.hash = 'InplviewHash' +

            ctx.clvp.wpid + '=' + encodeURIComponent(filter);


            filtrationApplied = true;

        }

    }


    return true;

}
9

Thank you sir. I did not see this reply until now, however it works just fine.

I sincerely appreciate your efforts.

I am trying to figure out how to make it work when the style is set to something other that default (would like basic list). I am not even sure if this is possible just yet.

10

Hi,
The same properties are available with other themes, so you just need to assign suitable values of colors and fonts.

11

Thank you Sir. :wink: