Qlik Community

Qlik Sense Integration, Extensions, & APIs

Discussion board where members can learn more about Integration, Extensions and API’s for Qlik Sense.

Announcements
BARC’s The BI Survey 19 makes it official. BI users love Qlik. GET REPORT
Partner
Partner

Kill Hypercube

Hi,

 

I'm new to mashup and currently following this tutorial

https://youtu.be/-w-d1Am2cjY

 

However, when I add the cleanup(); function in the page1 and page2 function, i will have an empty dashboard as below

 
Labels (3)
1 Solution

Accepted Solutions
oz_moyal
New Contributor III

Re: Kill Hypercube

Hi Hann,
You have a typo
u start with 
var model = []; 

notice u used model without an S at the end

buy then u push to :

models.push(model)}

notice now u typed modelS

so u need to fix the first declaration to:
var models = []; 


View solution in original post

6 Replies
Partner
Partner

Re: Kill Hypercube

here is my  js script

/*
* Bootstrap-based responsive mashup
* @owner Enter you name here (xxx)
*/
/*
* Fill in host and port for Qlik engine
*/
var prefix = window.location.pathname.substr( 0, window.location.pathname.toLowerCase().lastIndexOf( "/extensions" ) + 1 );

var config = {
host: window.location.hostname,
prefix: prefix,
port: window.location.port,
isSecure: window.location.protocol === "https:"
};
//to avoid errors in dev-hub: you can remove this when you have added an app
var app;
require.config( {
baseUrl: (config.isSecure ? "https://" : "http://" ) + config.host + (config.port ? ":" + config.port : "" ) + config.prefix + "resources"
} );

require( ["js/qlik"], function ( qlik ) {

var control = false;
qlik.setOnError( function ( error ) {
$( '#popupText' ).append( error.message + "<br>" );
if ( !control ) {
control = true;
$( '#popup' ).delay( 1000 ).fadeIn( 1000 ).delay( 11000 ).fadeOut( 1000 );
}
} );
$( "body" ).css( "overflow: hidden;" );
function AppUi ( app ) {
var me = this;
this.app = app;
app.global.isPersonalMode( function ( reply ) {
me.isPersonalMode = reply.qReturn;
} );
app.getAppLayout( function ( layout ) {
$( "#title" ).html( layout.qTitle );
$( "#title" ).attr( "title", "Last reload:" + layout.qLastReloadTime.replace( /T/, ' ' ).replace( /Z/, ' ' ) );
//TODO: bootstrap tooltip ??
} );
app.getList( 'SelectionObject', function ( reply ) {
$( "[data-qcmd='back']" ).parent().toggleClass( 'disabled', reply.qSelectionObject.qBackCount < 1 );
$( "[data-qcmd='forward']" ).parent().toggleClass( 'disabled', reply.qSelectionObject.qForwardCount < 1 );
} );
app.getList( "BookmarkList", function ( reply ) {
var str = "";
reply.qBookmarkList.qItems.forEach( function ( value ) {
if ( value.qData.title ) {
str += '<li><a data-id="' + value.qInfo.qId + '">' + value.qData.title + '</a></li>';
}
} );
str += '<li><a data-cmd="create">Create</a></li>';
$( '#qbmlist' ).html( str ).find( 'a' ).on( 'click', function () {
var id = $( this ).data( 'id' );
if ( id ) {
app.bookmark.apply( id );
} else {
var cmd = $( this ).data( 'cmd' );
if ( cmd === "create" ) {
$( '#createBmModal' ).modal();
}
}
} );
} );
$( "[data-qcmd]" ).on( 'click', function () {
var $element = $( this );
switch ( $element.data( 'qcmd' ) ) {
//app level commands

case 'page1':
page1();
break;
case 'page2':
page2();
break;
case 'clearAll':
app.clearAll();
break;
case 'back':
app.back();
break;
case 'forward':
app.forward();
break;
case 'lockAll':
app.lockAll();
break;
case 'unlockAll':
app.unlockAll();
break;
case 'createBm':
var title = $( "#bmtitle" ).val(), desc = $( "#bmdesc" ).val();
app.bookmark.create( title, desc );
$( '#createBmModal' ).modal( 'hide' );
break;
}
} );
}

//callbacks -- inserted here --
//open apps -- inserted here --
var app = qlik.openApp('020bedf4-b476-466e-b9cc-dea592f73d9f', config);


//get objects -- inserted here --
var model = [];
page1();

function page1(){
cleanup();
app.getObject('QV03','ARNmpdM').then(model=>{models.push(model)});
app.getObject('QV02','ZxDKp').then(model=>{models.push(model)});
app.getObject('QV01','NaKQwM').then(model=>{models.push(model)});
}

function page2(){
cleanup();
app.getObject('QV03','JZMrdb').then(model=>{models.push(model)});
app.getObject('QV02','tmaqpf').then(model=>{models.push(model)});
app.getObject('QV01','nRxXG').then(model=>{models.push(model)});
}

function cleanup(){
$.each(models,function(i,e){
console.log('removed:', e);
e.close();

});
models =[];
}



//create cubes and lists -- inserted here --
if ( app ) {
new AppUi( app );
}

} );

Partner
Partner

Re: Kill Hypercube

This is the empty dashboard. I need to comment the cleanup(); in the function page1 and page2 to make the object appear. But that defeat the purpose of this tutorial

 

image.png

Highlighted
ErikWetterberg
Honored Contributor

Re: Kill Hypercube

Hi,

have you checked the browser console for errors?

Looks like a type when you create the models array, the trailing s is missing. That might cause the cleanup function to break.

Partner
Partner

Re: Kill Hypercube

Hi Erik,

 

Below is the console. I've check the code, it is the same as the tutorial.

var model = [];
page1();

function page1(){
cleanup();
app.getObject('QV03','ARNmpdM').then(model=>{models.push(model)});
app.getObject('QV02','ZxDKp').then(model=>{models.push(model)});
app.getObject('QV01','NaKQwM').then(model=>{models.push(model)});
}

function page2(){
cleanup();
app.getObject('QV03','JZMrdb').then(model=>{models.push(model)});
app.getObject('QV02','tmaqpf').then(model=>{models.push(model)});
app.getObject('QV01','nRxXG').then(model=>{models.push(model)});
}

function cleanup(){
$.each(models,function(i,e){
console.log('removed:', e);
e.close();

});
models =[];
}

 

image.png

oz_moyal
New Contributor III

Re: Kill Hypercube

Hi Hann,
You have a typo
u start with 
var model = []; 

notice u used model without an S at the end

buy then u push to :

models.push(model)}

notice now u typed modelS

so u need to fix the first declaration to:
var models = []; 


View solution in original post

Partner
Partner

Re: Kill Hypercube

Hi Oz_Moyal,

Thanks. I have tried it and yes its the typo.

I'd like to know if the user already have the pro/analyzer base subscription license, do they need any other additional license to implement the mashup or to integrate the object to another app?

Thanks.