Unlock a world of possibilities! Login now and discover the exclusive benefits awaiting you.
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:
This is what I am willing to achieve:
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.
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;
}
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.
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!
I am currently using Qlik Sense Desktop 3.1 SR3.
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?
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;
}
It works!!! Thank you so much!!