Hypercube do not refresh after filter selection change

[kikko]

Hi All,

I'm developing a mashup working with hypercubes. I have created a cube as described below in the code section. The code extract a name as text from the cube matrix and place it into a <div>.

The code works fine but I can get the data updated if a change a selection from a filter object. I need to refresh the page each time I change the selection.

This not happen if I use visualization on the fly such as a KPI element or charts.

Can someone help me to understand what I miss in the code? I think I need to create a function listening for selection changes but I don't know how to do that.

thank you! 

app.createCube({
	"qInitialDataFetch": [
		{
			"qHeight": 1,
			"qWidth": 1
		}
	],
	"qDimensions": [
		{
			"qDef": {
				"qFieldDefs": [
					"[Workshop name]"
				]
			},
			"qNullSuppression": true,
			}
	],
	"qSuppressZero": false,
	"qSuppressMissing": true,
	"qMode": "S",
	"qStateName": "$"
	
	}).then(function(reply){
		let name = reply.layout.qHyperCube.qDataPages[0].qMatrix[0][0].qText;
		document.getElementById("TSname").innerHTML = name;
	})

[Øystein_Kolsrud · Accepted solution]

Is this the endpoint you are using?

https://help.qlik.com/en-US/sense-developer/February2021/Subsystems/APIs/Content/Sense_ClientAPIs/Ca...

If so, then I believe you should pass that callback function as an argument and not apply in sequence on the returned promise. If I understand the documentation correctly, then that will ensure the function is called every time there is a change notification on the object containing the hypercube.

[kikko]

Hi Yko,

If I understood your suggestion I changed the code like that:

app.createCube({
	"qInitialDataFetch": [
		{
			"qHeight": 1,
			"qWidth": 1
		}
	],
	"qDimensions": [
		{
			"qDef": {
				"qFieldDefs": [
					"[Workshop name]"
				]
			},
			"qNullSuppression": true,
			}
	],
	"qSuppressZero": false,
	"qSuppressMissing": true,
	"qMode": "S",
	"qStateName": "$"
	
	},testname);

Then I wrote a function to use the callback:

function testname(reply, app){
		let name = reply.layout.qHyperCube.qDataPages[0].qMatrix[0][0].qText;
		document.getElementById('TSname').innerHTML = name;
	}

Effectively this is the same explained in an example in 2020 manual:

https://help.qlik.com/en-US/sense-developer/June2020/Subsystems/Dev-Hub/Content/Sense_Dev-Hub/Howtos... 

But in this way the "name" is not show in the <div> . I think I didn't understand what you suggested to me!

Please can you help to get the solution? Using the hypercube is a fantastic way to completely personalize your mashup as you want instead of fighting with already prepared object and their standard CSS.

Thank You

[kikko · Accepted solution]

Hi Yko,

sorry I didn't get the point!! My fault!! I'm not too much skilled in JS!

I have found the solution from the link you suggested me.

The code below is working fine now and I can see names change with selections.

Thank you so much!! You save my day :))

app.createCube({
	"qInitialDataFetch": [
		{
			"qHeight": 1,
			"qWidth": 1
		}
	],
	"qDimensions": [
		{
			"qDef": {
				"qFieldDefs": [
					"[Workshop name]"
				]
			},
			"qNullSuppression": true,
			}
	],
	"qSuppressZero": false,
	"qSuppressMissing": true,
	"qMode": "S",
	"qStateName": "$"
	}, function(reply,app) {
	var name = "";
	$.each(reply.qHyperCube.qDataPages[0].qMatrix, function(key, value) {
		name = value[0].qText;
	});
	document.getElementById("TSname").innerHTML = name;
});