Mashup: How to handle current selections on mobile?

[#1]

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?

[Vincenzo_Esposito]

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

[#3]

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?

[Vincenzo_Esposito]

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.

[Alexander_Thor]

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('$')

[Francis_Kabinoff]

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;

}

[#7]

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

[Francis_Kabinoff]

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;

}

[#9]

Perfect Thanks Francis!