Mash Up help

[Mahamed_Qlik]

Hello guys,

Working with simple mashup is easy task as we all know and lets do some complex mashup.

We have two application and we are creating single mashup page pulling different KPI /Chart/Table object from these two application. Let's say in our case we are considering Bar chart and  filter pane from app1 and pie chart and KPI object from app2 to display in mashup page also we will keep only single filter pane for the dimension named as "Monthname" which means we will give user to select the monthname from dropdown and it should applied on each objects in the page from app1 and app2.

We have designed something as below just for testing purpose.

It is working perfectly fine when user selects the month number from dropdown all the charts are getting changed.

Now the challenge is we have created another dimension in both the apps named as "MonthName" which has values like 'Jan,Feb,Mar' etc... so below code is not working which means on selection of monthname from drop down only objects from app1 is getting changed.

var app =  qlik.openApp('7c7ce7cb-xxxxxxxxxxxxxxxxxxxxxxxxxxx', config);

var app2 = qlik.openApp('14e1bfaf-xxxxxxxxxxxxxxxxxxxxxxxxxxx', config);

//get objects -- inserted here --

app.getObject('QV01','bkJFpdZ');     // Bar chart from app1

app.getObject('QV03','HVNtSXp');     // MonthNumber Filter from app1

//app.getObject('QV03','SmuUzq');      // MonthName Filter from app1   ( If we add this dimension for monthname the below code is not working)

app2.getObject('QV02','pGrLeJ');     // Pie chart from app2

app2.getObject('QV04','RTwJE');      // KPI object from app2

var selState = app.selectionState( );

var listener = function() {

app2.clearAll();

    var selFields = selState.selections;

var cacheString="";

console.log("selFields",selFields)

if (selFields!=null){

$.each(selFields, function(key, value) {

var valArray=[];

$.each(value.selectedValues, function(key,value){

        //valArray.push(value.qName);

isNaN(value.qName) ? valArray.push(value.qName):valArray.push(Number(value.qName));

})

cacheString=cacheString + '@' + value.fieldName +"~" + value.qSelected;

app2.field(value.fieldName).selectValues(valArray);

});

localStorage.setItem("QlikFilter",cacheString);

}

  };

  selState.OnData.bind( listener );

retrieveSelectionfromCache();

function retrieveSelectionfromCache()

{

var cacheString= localStorage.getItem("QlikFilter");

if (cacheString!=null && cacheString !=""){

app.clearAll();

var selFields=cacheString.split("@");

$.each(selFields, function(key, value) {

if (value!=null && value!=""){

var valArray=[];

var s = value.split("~");

var fieldName=s[0];

valArray = s[1].split(", ");

app.field(fieldName).selectValues(valArray);

}

});

}

else{

app.clearAll();

}

}

} );

Code reference is : http://www.codewander.com/qlik-sense-mashup-apply-filters-across-two-or-more-apps/ 

[alex_colombo]

Hi @Mahamed_Qlik , I tested your code in a sample mashup and it works, applying a filter from app1 immidiately reflect the same selection in app2.

[Mahamed_Qlik]

Hi Alex,

If it is working then what is the purpose of posting question here 😉

Well, It is working fine but problem it is working only with month as number and if you change the field from number to month name it is not working. 

[alex_colombo]

Oh sorry, now it is clear your request, Anyway, filtering Jan value is not working becuase this is a date type field and behind the scenes there is no Jan value, but 1 as integer. Indeed, if you try to pass 1 to selectValues method this will apply a selection on Jan value.
My suggestion here is to apply selections in different way. With your approach, reading selection state, you cannot read all selected values if user will select more than 6 values. Indeed, with selection state, you can read field selected values up to 6 values. If you try to select 7 values, you will see only the first 6 applied to your app number 2. And then you have this issue on date type field.
Based on above, you have to use selection state for understading which fields are selected. Then you have to loop over these fields name and create a ListObject (here how to create it) for reading all selected values. Then use these values for apply selections on app2 using selectValues method.
For dates field you have to read qNum property from ListObject and use those numbers for apply the correct selections

[Mahamed_Qlik]

Now you got it...!!!

It will be really helpful if you can modify above code and send it to me as I am not JS expert.. 🙂