topic Re: Callback for selectValues in mashup in Integration, Extension & APIs

Callback for selectValues in mashup

Anonymous — Thu, 12 Jul 2018 11:17:22 GMT

Hi there,

I was wondering if there was any callback function after triggering selectValues API.

This is broadly what we are doing (trough angularJS) : we display some KPIs (items) from qlik in an html page.

Then we want to be able to update those items based on a list values (company departments), so KPI are updated accordingly.

We want to display a list of these values, select one or more, then apply to the displayed tiems (quiksense filter (?))

Based on tutorials i've seen on Qlik's Youtube, this is my cleaned up code :

$scope.app.createList({
    "qDef":{
        "qFieldDefs":["Departments"]
    },
    "qInitialDataFetch":[{
        qTop:0,
        qLeft:0,
        qHeight:10,
        qWidth:0
    }]
}, function(reply){
    $('#dptFilter').empty();
    var qObject = reply.qListObject;
    //if we have some values
    if(qObject.qDataPages[0].qMatrix && qObject.qDataPages[0].qMatrix.length>0){
        $.each(qObject.qDataPages[0].qMatrix, function(){
            var item=this[0];
            var selT="";
            //check if item is selected and apply class
            if (item.qState=="S"){
                currentReg=item.qText;
                selT=" filtActive";               
            }
            //output to HTML
            $('#dptFilter').append('<div class="col-xs-4'+selT+'"><a>'+item.qText+'</a></div>');
        });
        var selArray=[];
        //check if item is already in array
        function checkArray(arr,item){
            var index=-1;
            $.each(arr,function(i){
                if(this.qText==item.qText){
                    index=i;
                    return false;
                }
            });
            return index;
        }
        //on click on an item, remove or add it to the selection array
        $('#dptFilter div').click(function(){
            var sel={qText:$(this).text()};
            var index=checkArray(selArray,sel);
            if(index>-1){
                $(this).removeClass('filtActive');
                selArray.splice(index,1);
            }else{
                $(this).addClass('filtActive');
                selArray.push({qText:$(this).text()});
            }
        });
        //on click on submit button, trigger selectValues method
        $("#submitDptFilt").click(function(){
            $scope.app.field("Departments").selectValues(selArray,false,true);
        })
    }
    //else, no values -> hide container
    else{
        $('#filtersContainer').hide();
    }
   
});

Because we have 30-40 KPI items in the page (displayed through expand/collapse feature or modal, but all in DOM), the selectValues method can take a while, somehow freezing the page while working on, during a few seconds.

My question is then :

Is there a way to have a callback on this method ? I mean in order to know when is has finished filtering and updating all KPIs in client's browser.

This way i could display a loading overlay and remove it when done.

Many thanks !

Re: Callback for selectValues in mashup

ErikWetterberg — Thu, 12 Jul 2018 18:44:29 GMT

Hi,

Normally the selectValues call is very fast. That's because the calculations aren't done yet. Instead what you get back from the selectValues call would be an array with handles to all objects that are affected. If you use the browser console to watch the traffic on the web socket you would see this ( also if use use the Engine API explorer in dev-hub). So even though the selectValues call returns a promise, waiting for that won't help.

What normally takes time is the getLayout call(s) made after that, that's when the calculation happens. You really need to wait until all those are ready. I don't know of any case where this has been done but it should be possible, though there isn't really any support for that in the APIs.

Erik Wetterberg

Re: Callback for selectValues in mashup

Anonymous — Mon, 16 Jul 2018 08:45:52 GMT

Thanks Eric for your answer.

So it's not the selectValues that takes time, but the updates to the layout after that.

You really need to wait until all those are ready

Yes, that's the point...

But I can't find any documentation or code samples that allow this to be done.

When using an UI, it's really important (UX purposes) that we know the current state of the app: loading (data fetching), working (client-side), ready (update completed)

A bit disappointed that it's not integrated in the API by default...

No idea where I should dig info for that?

Thanks again

Re: Callback for selectValues in mashup

satyaprakash — Wed, 23 Jan 2019 15:37:08 GMT

Hi,

Did you found any solutions for this? Facing same issues.

Regards,

Satya

Re: Callback for selectValues in mashup

pabankes_bcc — Wed, 08 Jan 2020 19:49:29 GMT

I am having this same issue. Has any solution been found?