Trouble getting updateData() to function within a loop

  • 1
  • Question
  • Updated 1 year ago
  • (Edited)
Hello fellow Skuid-ees!
Some background in case I'm missing a better way to go about doing what I'm trying to do. I am attempting to create a chart which shows 90 days of data for the metric # of unique coaches with a sale in the last 30 days. So my approach has been to create one model which looks at a 30 day period, then use javascript in a before render snippet to increment the conditions and capture the # distinct coaches. I'll then store each # of distinct coaches and then put it on the chart, however I'm not getting the model to update the data even though I've tried to put the function within the updateData() call. 

Thanks for any advice or comments!
Josh



 
var chartObj = arguments[0], $ = skuid.$; var subPayeeModel = skuid.model.getModel('AggCoachesWithSaleL30'); var firstDateCond = subPayeeModel.getConditionByName('firstDate'); var lastDateCond = subPayeeModel.getConditionByName('lastDate'); var tempFirstDate; var tempLastDate; var tempCoaches = 0; var chartData = []; var lastCondValue; var firstCondValue; for(var i = 0; i < 90; i++){ tempFirstDate = 120-i; tempLastDate = 90-i; firstCondValue = "LAST_N_DAYS:" + tempFirstDate; lastCondValue = "LAST_N_DAYS:" + tempLastDate; subPayeeModel.setCondition(subPayeeModel.getConditionByName('firstDate'), firstCondValue); subPayeeModel.setCondition(subPayeeModel.getConditionByName('lastDate'), lastCondValue); subPayeeModel.updateData(captureData(subPayeeModel)); console.log("model data condition:", subPayeeModel.conditions[5].value); console.log("subpayeemodel:", subPayeeModel); console.log("tempCoaches:", tempCoaches); console.log("firstCondValue", firstCondValue); console.log("lastCondValue", lastCondValue); } function captureData(model) { tempCoaches = model.data[0].distinctCoaches; chartData.push(tempCoaches); console.log("fn subpayeemodel:", subPayeeModel); console.log("fn tempCoaches:", tempCoaches); console.log("fn chartData", chartData); }


Console Log output:
Photo of Josh Merritt

Josh Merritt

  • 918 Points 500 badge 2x thumb

Posted 1 year ago

  • 1
Photo of mB Pat Vachon

mB Pat Vachon, Champion

  • 42,714 Points 20k badge 2x thumb
Do you need each query to sequentially?
Photo of Josh Merritt

Josh Merritt

  • 918 Points 500 badge 2x thumb
Hi Pat, 

Not sure I understand what you're asking, but it doesn't matter how it calculates. Meaning it doesn't need to do anything with the values along the way, just have an array of values that I can push into the chart series data element.

The elements do need to be properly ordered such that it goes from the oldest period to the newest, i.e. [ (#Uniques in Data from 90 to 120 days ago), (#Uniques in Data from 89 to 119 days ago),....,(#Uniques in Data from 0 to 30 days ago) ]

Does that answer your question?

Thanks,
Josh
Photo of mB Pat Vachon

mB Pat Vachon, Champion

  • 42,714 Points 20k badge 2x thumb
Well, looks to me like you'll need to set this up a function that calls itself once the query is complete. Try something like this. Uses the jquery when function.

var chartObj = arguments[0],
	$ = skuid.$;

var subPayeeModel = skuid.model.getModel('AggCoachesWithSaleL30');
var firstDateCond = subPayeeModel.getConditionByName('firstDate');
var lastDateCond = subPayeeModel.getConditionByName('lastDate');
var tempFirstDate;
var tempLastDate;
var tempCoaches = 0;
var chartData = [];
var lastCondValue;
var firstCondValue;

function queryModel () {
    tempFirstDate = 120-i;
    tempLastDate = 90-i;
    firstCondValue = "LAST_N_DAYS:" + tempFirstDate;
    lastCondValue = "LAST_N_DAYS:" + tempLastDate;
    subPayeeModel.setCondition(subPayeeModel.getConditionByName('firstDate'), firstCondValue);
    subPayeeModel.setCondition(subPayeeModel.getConditionByName('lastDate'), lastCondValue);

	$.when( subPayeeModel.updateData(captureData(subPayeeModel)))
           .done(function(){
		alert( x.testing ); // Alerts "123"
		    console.log("model data condition:", subPayeeModel.conditions[5].value);
		    console.log("subpayeemodel:", subPayeeModel);
		    console.log("tempCoaches:", tempCoaches);
		    console.log("firstCondValue", firstCondValue);
		    console.log("lastCondValue", lastCondValue);
		}
		if ( i < 90) {
			i++
			queryModel()
		}	
});

function captureData(model) {
    tempCoaches = model.data[0].distinctCoaches;
    chartData.push(tempCoaches);
    console.log("fn subpayeemodel:", subPayeeModel);
    console.log("fn tempCoaches:", tempCoaches);
    console.log("fn chartData", chartData);
}
Photo of Josh Merritt

Josh Merritt

  • 918 Points 500 badge 2x thumb
Thank you so much Pat!

I've managed to hack my way to the basics, but clearly I need to go back to the basics of javascript and solidify my understanding. 

I was able to get the function working properly! The only downside is the time it takes to process, so I'm contemplating if I should write a snippet to count the distinct coaches rather than rely on the model to perform the calculation. As is, I'm going to load this chart on a button click so it doesn't hold up the entire page load. 

Here's my finished snippet in case anyone else finds themselves trying to do something similar:


var chartObj = arguments[0],
$ = skuid.$;

console.log("chart", chartObj);

var subPayeeModel = skuid.model.getModel('AggCoachesWithSaleL30');
var firstDateCond = subPayeeModel.getConditionByName('firstDate');
var lastDateCond = subPayeeModel.getConditionByName('lastDate');
var tempFirstDate;
var tempLastDate;
var tempCoaches = 0;
var chartData = [];
var lastCondValue;
var firstCondValue;
var i = 0;

queryModel();



function queryModel() {
    tempFirstDate = 120-i;
    tempLastDate = 90-i;
    firstCondValue = "LAST_N_DAYS:" + tempFirstDate;
    lastCondValue = "LAST_N_DAYS:" + tempLastDate;
    subPayeeModel.setCondition(firstDateCond, firstCondValue);
    subPayeeModel.setCondition(lastDateCond, lastCondValue);

$.when(subPayeeModel.updateData(captureData(subPayeeModel)))
           .done(function(){
        if ( i <= 90) {
        i++;
        queryModel();
        }
            });
}

function captureData(model) {
    tempCoaches = model.data[0].distinctCoaches;
    chartData.push(tempCoaches);
}

(Edited)