Qlik Community

Integration, Extension & APIs

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

Announcements
QlikWorld online is next week! REGISTER NOW
cancel
Showing results for 
Search instead for 
Did you mean: 
amityehoclimber
Contributor III
Contributor III

Qlik Sense Mashup Issue - List Box Toolbar is not showing when making selections

Goal:

I am trying to show a List Box's toolbar when selecting one of its values in a Qlik Sense Mashup.

Problem:

Toolbar is not showing up.

This is the code:

</html>
...
<body>
...
<div class="row">
    
<div class="col-xs-12 col-lg-12">
         
<div style="position:relative">
              
<div id="QV20" style="width:100%;height:350px;top:0px;left:0px;z-index:1300;"></div>
         
</div>
    
</div>
</div>
...
</body>
</html>

This is my current result:

Selection Toolbar problem.PNG


This is what I am willing to achieve:

Selection Toolbar solved.PNG


I tried the following already:

1) changing the top into multiple values --> no toolbar

2) Tried to change the z-index --> still no toolbar

3) Tried to change the height --> still no toolbar

4) even tried to use this:

    style="width:calc(100% - 4px); height:calc(8.33333% - 4px); left:calc(0% + 2px); top:calc(0% + 2px);"

     this comes straight from Qlik Sense itself --> and still no toolbar

PS: as you can see, I am also using Bootstrap to create my Mashup.

1 Solution

Accepted Solutions
Francis_Kabinoff
Employee
Employee

Ahh, that's the one thats been working for me. It's hard to say without being able to inspect the page, sorry. If I were inspecting the page, the first thing I would look for is any overflow: hidden being set on any parent element of .qv-selection-toolbar...maybe something like the following would work...

.qv-filterpane {

    overflow: visible;

}

View solution in original post

7 Replies
Aiham_Azmeh
Employee
Employee

Hi amityehoclimber‌,

This looks like a bug, can you please share your Qlik Sense version?

regards,

Francis_Kabinoff
Employee
Employee

Hi amityehoclimber‌,

Try adding the following css

.qv-selection-toolbar {

  position: absolute !important;

}

aaz‌, I believe it may be a bug. I started seeing it on some occasions when the demo team upgraded from 3.0 to 3.1 sr4. I haven't reported it yet, because it doesn't happen in all of our mashups, and so far I've been unable to pinpoint when it does and when it doesn't. But adding the above css seems to fix the issue.

Aiham_Azmeh
Employee
Employee

Hi fka‌,

You're right, I am almost certain seeing the bug reported, and then fixed for the next releases - but just to be sure - I would like to know what version(s) is affected.

BTW, great thx for the workaround!

amityehoclimber
Contributor III
Contributor III
Author

I am currently using Qlik Sense Desktop 3.1 SR3.

amityehoclimber
Contributor III
Contributor III
Author

Thanks fka‌. I have implemented your css in my code but the list box is still not showing its toolbar.

Is there any other way around this?

Francis_Kabinoff
Employee
Employee

Ahh, that's the one thats been working for me. It's hard to say without being able to inspect the page, sorry. If I were inspecting the page, the first thing I would look for is any overflow: hidden being set on any parent element of .qv-selection-toolbar...maybe something like the following would work...

.qv-filterpane {

    overflow: visible;

}

amityehoclimber
Contributor III
Contributor III
Author

It works!!! Thank you so much!!