topic Re: QS Mashup is clearing all selections when I change Tabs in App Development

QS Mashup is clearing all selections when I change Tabs

wardzynski — Tue, 05 Dec 2017 00:21:35 GMT

Dear QS Experts,

I am working on a set of Mashups built upon QS Apps residing in QS Enterprise server version 11.11.2 June 2017 Patch 2.

I have an inconsistent behaviour in my Mashups. Whenever I am selecting and moving between my tabs inside my Mashups the selections get cleared, and sometimes my fields stay selected.

I have allocated the clearAll() function in two places:

1) .js

switch ( $element.data( 'qcmd' ) ) {
	//app level commands
	case 'clearAll':
		app.clearAll();
		break;

2) .html

<a class="qcmd1 col-sm-12" data-qcmd="clearAll">CLEAR ALL</a>

I am also attaching the function that deals with the selections in my Mashup:

function applySelections()

{

var sPageURL = window.location.search.substring(1);

var sURLVariables = sPageURL.split('?');

for (var i = 0; i < sURLVariables.length; i++)

{

var sParameterName = sURLVariables.split('=');

var FieldName = decodeURI(sParameterName[0]);

var FieldValues = decodeURI(sParameterName[1]).split(',');

for(var j = 0; j < FieldValues.length; j++)

{

if (FieldValues.match(/^[0-9]+$/) != null) {

FieldValues = parseInt(FieldValues, 10);

}

app.field(FieldName).selectValues(FieldValues, true, true);

}

Re: QS Mashup is clearing all selections when I change Tabs

rbartley — Tue, 05 Dec 2017 09:38:04 GMT

Dear Daniel,

How have you implemented the tabs? Are the tabs on the same html page or on a different page?

Re: QS Mashup is clearing all selections when I change Tabs

rbartley — Tue, 05 Dec 2017 09:41:13 GMT

Please post your HTML page(s) containing the tabs.

Re: QS Mashup is clearing all selections when I change Tabs

wardzynski — Wed, 06 Dec 2017 00:00:00 GMT

HI Richard,

All the pages have different tabs using seperate .html files:

Page 1:

--------------

<!doctype html>

<title>XXXXXXXXXXX</title>

</head>

</div>

<!--

</div>

<!--

A fake / hidden checkbox is used as click reciever,

so you can use the :checked selector on it.

-->

<!-- <input type="checkbox" />

<!--

Some spans to act as a hamburger.

-->

<!-- <span class="hamburger"></span>

<!--

Too bad the menu has to be inside of the button but hey, it's pure CSS magic.

-->

<!-- <div id="menu">

<div class="hamburgerheader" style="cursor: pointer;" data-qcmd="clearAll">Clear all</div>

<div class="hamburgerheader" style="cursor: pointer;" data-qcmd="back">Remove Last Selection</div>

<div class="hamburgerheader">Filter:</div>

</div>

</nav>

-->

</div>

XXXXXXXXXXXXXXX

</div>

<li class="active"><a href="">Overview</a></li>

</ul>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<!--<div class="col-sm-12 qvobject qvobject4" id="QV106">

</div>-->

</div>

<a class="qcmd1 col-sm-12" data-qcmd="clearAll">CLEAR ALL</a>

<a class="qcmd1 col-sm-12" data-qcmd="back">REMOVE LAST SELECTION</a>

<h4>

Treating Team

</h4>

</div>

</div>

.....

</div>

</div></section>

</div>

</div>

</p>

</div>

$('html,body').animate({scrollTop:0},800);

</script>

</body></html>

--------------

Page 2:

--------------

BASICALLY SAME

--------------

Page 3:

--------------

BASICALLY SAME

--------------

etc...

Re: QS Mashup is clearing all selections when I change Tabs

rbartley — Wed, 06 Dec 2017 08:25:31 GMT

Hi Daniel,

Do all of your html files call qlik.openApp()? If so, then the selections will not be kept as you navigate between the different HTML pages. I was advised that it is better to have the tabs within the same html page and to hide/show the divs containing the tab code.

Re: QS Mashup is clearing all selections when I change Tabs

wardzynski — Wed, 06 Dec 2017 23:42:20 GMT

Hi Richard,

None of the HTML files call the qlik.openApp function.

Moving all tabs to 1 html is not an option, as we are using a bootstrap etc...

I find the mashup technology a bit to buggy, should have been more stable at this point.

No other options?

Re: QS Mashup is clearing all selections when I change Tabs

rbartley — Thu, 07 Dec 2017 08:55:54 GMT

Hi Daniel,

You must be opening the app in one of the script files referenced in one of your html files otherwise how can you access your visualizations? I am using bootstrap too and have combined the tabs into one html file. Here's a link to a page that might help you out:

https://www.w3schools.com/bootstrap/bootstrap_tabs_pills.asp

Here's a snippet:

</ul>

<p>Some content.</p>

</div>

<p>Some content in menu 1.</p>

</div>

<p>Some content in menu 2.</p>

</div>

You can maintaining selections in this way and I have not found this approach to be buggy at all. It's just a question of understanding how mashups work - create session, open app, reference objects, apply and change selections etc.

I hope this helps