topic Re: Mashup: How to handle current selections on mobile? in Integration, Extension & APIs

Mashup: How to handle current selections on mobile?

Thu, 26 May 2016 18:06:15 GMT

Building a mashup and trying it out I find out that the CurrentSelections bar and the global selections doesn't scale on mobile by default. Is this a bug or not implemented? And how do you make it work on mobile?

Re: Mashup: How to handle current selections on mobile?

Vincenzo_Esposito — Thu, 26 May 2016 18:22:57 GMT

You should have a badge with the number of filters applied. When you click on it a detailed filter pane appears

Re: Mashup: How to handle current selections on mobile?

Mon, 30 May 2016 19:10:54 GMT

Exactly my point, I should have.

I am building a mashup and fetch the CurrentSelection object, but it's not responsive like in the Qlik Sense Hub apps.

Is there a CurrentSelectionMobile object?

Re: Mashup: How to handle current selections on mobile?

Vincenzo_Esposito — Tue, 31 May 2016 06:55:46 GMT

Karl if you've built your own Mashup, is up to you make it responsive. Basically if you can use some responsive template like Bootstrap which does this work for you.

For the selection bar it's an option to select on dev-hub (single or mashup editor) in order to include it.

Re: Mashup: How to handle current selections on mobile?

Alexander_Thor — Tue, 31 May 2016 10:56:57 GMT

Hey,

Currently the current selections object does not support what we call Small Devices mode.

I guess you could potentially trick it into it by setting isSmallDevice = true on scope but I wouldn't count on it.

You could of course use the standard object for larger devices and when your page hits a certain breakpoint swap it out for something custom. You can use the Selection API to get the current selections qlik.app.selectionState('$')

Re: Mashup: How to handle current selections on mobile?

Francis_Kabinoff — Tue, 31 May 2016 15:04:20 GMT

Something I like to do if I use the CurrentSelection Object is hide the control panels on the left and right on mobile. It's not exactly what you're looking for, but it's easy to implement, and works pretty well. Here's an example Qlik Sense: Mashup and the required css below

/* hides the left and right panels of the CurrentSelection Object */

.buttons.borderbox, .buttons-end.borderbox {

display: none;

}

/* shifts the selection boxes to the left */

.qv-panel-current-selections .qv-selections-pager {

padding-left: 0px;

}

Re: Mashup: How to handle current selections on mobile?

Mon, 03 Oct 2016 21:23:22 GMT

Hi Francis,

Is it possible to disable just the selections tool and move the global search icon to the right?

I was able to prevent the window from opening by setting

.qv-global-selections {

display:none;

}

Thanks

Re: Mashup: How to handle current selections on mobile?

Francis_Kabinoff — Tue, 04 Oct 2016 13:00:54 GMT

Yea, should be.

/* hide the selection tool button */

.buttons-end button.qv-subtoolbar-button:nth-child(2) {

display: none;

}

/* move search button to right */

.global-search-button {

float: right;

}

Re: Mashup: How to handle current selections on mobile?

Tue, 04 Oct 2016 16:00:45 GMT

Perfect Thanks Francis!