page include load is redrawing a chart

  • 2
  • Problem
  • Updated 2 years ago
  • Acknowledged
When a page include loads it is redrawing a chart on my main page. Since that chart has a before render snippet that affects a related table, my table is reloading as well. My page include is related to the table, so I can't put it in a drawer like I would like. But also it seems to be removing my conditions on the related table so after I open the popup with my page include, more records than expected are showing up. 

Seems like the page include onload event is the same as the general page onload event, so the chart is redrawing, but I don't think it should. Video below

Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb

Posted 2 years ago

  • 2
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
Got to get this out of the way:   Do you have model name uniqueness?  If a model in Include is the same name as the chart model - the chart would interpret the include action as a model change and would redraw... 
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
nope. I checked and rechecked and checked again. Then checked some more. I really wanted that to be the issue, so I could know how to fix it. :) There's overlap with objects, but not with model names.

It seems to be a thing with page includes - I've got another page where I see the charts getting redrawn that are totally unrelated to the page include. There it doesn't cause any problems, but you can see them getting redrawn every time the page include loads.

I'm on 8.15.9
(Edited)
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
Does it redraw the chart to the default page load conditions, or is it drawing with updated conditions from the page include?
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
it just redraws it, there aren't any conditions from the page include that affect the chart. In this case the chart is a drilldown, and it redraws the drilldown chart (and doesn't reset it to the main chart), but it seems to reset the conditions that the chart passes to the model in the table to default page load conditions as opposed to maintaining the conditions that were passed when the chart entered the drilldown.
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
In that case: "The thing's broken"
Photo of Karen Waldschmitt

Karen Waldschmitt, Official Rep

  • 8,260 Points 5k badge 2x thumb
Jack~

To help reproduce the problem, can you paste the snippets you are using for the table and chart?

Thanks!
Karen
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
Hi Karen, my snippets are below. I'm sure there's a way I can get this to work in terms of not letting my table filter get reset, but if you go to any page with a chart and a page include, the chart will redraw when the page include loads and I'm not sure that's what you want to happen.


Here's the before render snippet on Chart 1, PlotCumulativePercent:
var chartObj = arguments[0],Shows = [];


var QANotesAggregateVarianceAnalysis = skuid.model.getModel('QANotesAggregateVarianceAnalysis');
var sumOfNotes=   0;
for(var i=0 ; i<QANotesAggregateVarianceAnalysis.data.length ;i++){
    sumOfNotes+= QANotesAggregateVarianceAnalysis.data[i].countId;
    
}
var sumOfPercentage = 0;
for(var i=0 ; i<QANotesAggregateVarianceAnalysis.data.length ;i++){
    sumOfPercentage += parseFloat(QANotesAggregateVarianceAnalysis.data[i].countId/sumOfNotes)*100;
    Shows.push(Math.round(sumOfPercentage));
}

var newSeries = {
name: 'Cumulative Percent',
    data: Shows,
    type: 'line',
    yAxis:'axis2'
}

if(chartObj.series.length<= QANotesAggregateVarianceAnalysis.data.length )
chartObj.series[chartObj.series.length] = newSeries;
//check out how it looks in the console after the change

var chart = arguments[0];
	$ = skuid.$;
$.extend(true, chart.plotOptions,{
        column: {
            dataLabels: {
                enabled: true,
                formatter: function () {
                    if(this.point.y>0)
                        return  this.point.y;
                }
            }
        },
         line: {
            dataLabels: {
                enabled: true,
                formatter: function () {
                    if(this.point.y>0)
                        return  this.point.y +' %';
                }
            }
        }
});

console.log('hello');
var params = arguments[0],	$ = skuid.$;
    var tableModel = skuid.model.getModel('QANotesVarianceAnalysis');
    var tableCondition = tableModel.getConditionByName('Subject__c');
    tableModel.deactivateCondition(tableCondition);
   
    
    var deferred = $.Deferred();

    $.when( tableModel.updateData())        
       .done(function () {
               // Success  
              deferred.resolve();  
                    
       })
       .fail(function () {
               // Error
               deferred.reject();
     });

return deferred.promise();
/*$.extend(chartObj,{

    tooltip: {

        enabled:false

    }    

});*/
 
Here's the snippet that gets called in the drilldown action from Chart 1 to Chart 2, ApplyFilterOnOtherModel:
var $ = skuid.$,
    QANotesAggregateVarianceAnalysis = skuid.$M('QANotesAggregateVarianceAnalysis'),
    PatientIndicators = skuid.$M('ChartPatientIndicators'),
    QANotesSubCategoryAgg = skuid.$M('QANotesSubCategoryAgg');


    $.each(QANotesAggregateVarianceAnalysis.conditions, function(i,condition){
        
        var agConditionName = condition.name.replace("Patient_Indicator__r.",''),
            basicCondition = PatientIndicators.getConditionByName(agConditionName);
        console.log(agConditionName)
        if(condition.inactive) {
            PatientIndicators.deactivateCondition(basicCondition);
        } else {
            PatientIndicators.activateCondition(basicCondition);
            PatientIndicators.setCondition(basicCondition,condition.value);
        }

    });
    
      $.each(QANotesAggregateVarianceAnalysis.conditions, function(i,condition){
        
        var agConditionName = condition.name,
            basicCondition = QANotesSubCategoryAgg.getConditionByName(agConditionName);
        
        if(condition.inactive) {
            QANotesSubCategoryAgg.deactivateCondition(basicCondition);
        } else {
            QANotesSubCategoryAgg.activateCondition(basicCondition);
            QANotesSubCategoryAgg.setCondition(basicCondition,condition.value);
        }

    });
And here's the before render snippet on Chart 2, PlotCumulativePercentSubCategory:
var chartObj = arguments[0],Shows = [];


var QANotesAggregateVarianceAnalysis = skuid.model.getModel('QANotesSubCategoryAgg');
var sumOfNotes=   0;
for(var i=0 ; i<QANotesAggregateVarianceAnalysis.data.length ;i++){
    sumOfNotes+= QANotesAggregateVarianceAnalysis.data[i].countId;
    
}
var sumOfPercentage = 0;
for(var i=0 ; i<QANotesAggregateVarianceAnalysis.data.length ;i++){
    sumOfPercentage += parseFloat(QANotesAggregateVarianceAnalysis.data[i].countId/sumOfNotes)*100;
    Shows.push(Math.round(sumOfPercentage));
        
}

var newSeries = {
name: 'Cumulative Percent',
    data: Shows,
    type: 'line',
    yAxis:'axis2'
}

chartObj.series[chartObj.series.length] = newSeries;
//check out how it looks in the console after the change

var chart = arguments[0];
	$ = skuid.$;
$.extend(true, chart.plotOptions,{
        column: {
            dataLabels: {
                enabled: true,
                formatter: function () {
                    if(this.point.y>0)
                        return  this.point.y;
                }
            }
        },
         line: {
            dataLabels: {
                enabled: true,
                formatter: function () {
                    if(this.point.y>0)
                        return  this.point.y +' %';
                }
            }
        }
});
/*$.extend(chartObj,{

    tooltip: {

        enabled:false

    }    

});*/
 
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
By the way, since I've got your attention here Skuid team, can you please take a look at this and comment? https://community.skuid.com/skuid/topics/force-com-site-page-not-working-in-internet-explorer-11-ui-...

Looks like pages with a header don't work in Internet Explorer, at least on a public force.com page. 

My link there works now because I removed the header and moved it into a wrapper instead. But prior to that it wouldn't let you edit any fields if there was a wrapper on the page. 
Photo of Amy Dewaal

Amy Dewaal, Official Rep

  • 8,200 Points 5k badge 2x thumb
Jack,

I think we've found the bug. A page include popup on the same page as a chart causes the chart to lose context. Thanks for pointing this bug out to us, and we'll let you know when this is fixed in a future release.

Thanks!
Amy
Photo of Jack Sanford

Jack Sanford, Champion

  • 8,322 Points 5k badge 2x thumb
OK great! Glad I could help, and glad it's not just that I'm stumped about how to fix.