Chart To SharePoint List

Hello,
I am trying the Chart to List documentation but having trouble with it. I created a Dashboard site and added the list to the page as well. I believe I have all the configurations correctly however nothing is happening.
I am using the SharePoint Fields AssignedTo and Status
internal
Here is my code:

var handlers = {};
handlers.preRender = function (config, logger) {
    logger.debug('Configuration: ', config);
 
    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=AssignedTo-FilterValue1=' + e.dataItem.AssignedTo 
              + '-' + 'FilterField2=Status-FilterValue2=' + e.dataItem.Status;
 
            window.location.hash = '{9F0A5D52-3E2B-4DB6-A294-863EB366E99D}' + ctx.clvp.wpid + '='+ encodeURIComponent(filter);
 
            filtrationApplied = true;
        }
    }
 
    return true;
}

On my task page the url is: _layouts/15/start.aspx#/Lists/at/AllItems.aspx#InplviewHashc4c6caef-f83b-4e15-acd7-1dc27b7053a8=CascDelWarnMessage%3D1-FilterField1%3DAssignedTo-FilterValue1%3DAlejandra%2520Garcia

On my dashboard page when try to look for view id it is: /DashBoard.aspx?View={9F0A5D52-3E2B-4DB6-A294-863EB366E99D}&FilterField1=AssignedTo&FilterValue1=Alejandra%20Garcia
I have tried both view ids but nothing seems to work. I don't see any errors in the developer tools. Please advise what I am doing wrong. As usual, I greatly appreciate your help.

Hello @David_E_Garza,

Welcome to Plumsail Community!

Please use the below code in Dashboard >> Advanced tab. This is the code from the article. You don't need to make any changes in it.

var handlers = {};
handlers.preRender = function (config, logger) {
    logger.debug('Configuration: ', config);
 
    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=AssignedTo-FilterValue1=' + e.dataItem.__proto__.AssignedTo 
              + '-' + 'FilterField2=Status-FilterValue2=' + e.dataItem.__proto__.Status;
 
            window.location.hash = 'InplviewHash' +
            ctx.clvp.wpid + '=' + encodeURIComponent(filter);
 
            filtrationApplied = true;
        }
    }
 
    return true;
}

Hello,
When I input this code in the advanced tab, it gives me an error in developer tools.


It only works for one person for one status. Please advise.

@David_E_Garza,

Could you please share the screenshots of the page with the dashboard and list and the Dashboard configuration, so I could reproduce the case.

Thank you!

Hello,

Caml
Aggregation Chart

I selected all on advanced and copy the code
var handlers = {};

handlers.preRender = function (config, logger) {

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

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=AssignedTo-FilterValue1=' + e.dataItem.__proto__.AssignedTo 

          + '-' + 'FilterField2=Status-FilterValue2=' + e.dataItem.__proto__.Status;



        window.location.hash = 'InplviewHash' +

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



        filtrationApplied = true;

    }

}



return true;

}

Hello,
I noticed that this works on the first click, then it gives the error. I then have to refresh the page in order to click on another name in order to work. So it seems to not read the code after the first click.

@David_E_Garza,

I couldn't reproduce the error on my tenant.

Are you using a default Task list?

On which page are you using DashBoard? Could you please share the screenshot.

Please check if you have the same error for a different list.

Hello,
I am using a task list that I have created. I created a site page and called it Dashboard. I added the chart on top and the list at the bottom.


I went to the default task page and added the chart on the top. It seems to work well there. Is that the only way to make the chart work?

Hello,
I believe I figured it out. I noticed that for my list view settings the style was at Basic Table.


When I moved it back to default it worked. So just a reference in case you see this again from someone. Thank you for helping me research this.

1 Like