How to add two or more extensions to the same sheet?

[Anonymous]

Hi,

I have created 2 objects in a sheet of same extension. If I change the parameters of one object, the other one are also getting reloaded with the new parameters. I just want the active object to be reloaded, not the other. Is there a solution to my issue?

Thanks

[websy1985]

Hi Luca,

What extension is it? Is it one you've created yourself?

It sounds like a scope issue with the extensions 'paint' script. Perhaps it has a hardcoded element ID for one of the HTML tags and is using that in part of the paint function? It's hard to say for sure without seeing the code behind the extension.

I hope that helps

Nick

[Anonymous]

Hi Nick,

Thanks for the quickly answer. Yes, it is an extension that I create myself. In the paint function there's a div with a hardcoded class that is called by jQuery to create a slider. I tried to create a random variable and assigned it to the div ID with no luck. Do you have any suggestion? I'll post the code if you need it.

Many thanks 😃

[websy1985]

Ok. You have a few options, which one is best depends on what you're actually doing. If you could send the code that would help. I'd be happy to take a look and suggest/implement a solution for you.

Thanks

Nick

[Anonymous]

Ok, here's the code inside the paint function

          $(".slider")

         // slider option

            .slider({

                 min: layout.props.limitInf,

                 max: layout.props.limitSup,

                 step: layout.props.sliderStep

             })

         // labels

            .slider("pips", {

                rest: "label"

            })

         // slider update

           .on("slidechange", function(e,ui) {

                 var val = ui.value + '';

                 qlik.currApp(ext).variable.setContent(layout.variableName, val);

            });

         //check if the slider already exist

            if(this.painted) return;

         //if not, create the div with the slider class

            else{

                 this.painted=true;

                 var html = "", ext = this;

                 html += '<div class="slider"></div>';

                 $element.html(html);

            }

if you need more explanation of the code just ask me 😃

Thanks a lot!

[websy1985 · Accepted solution]

The issue is your jQuery selector for ".slider" which will select all instances of it and apply the same logic. Try changing that part of the code to -

$element.find(".slider")
         // slider option
            .slider({
                 min: layout.props.limitInf,
                 max: layout.props.limitSup,
                 step: layout.props.sliderStep
             })

That should only select the .slider element inside of the current extension.

[Anonymous]

It works!! Thanks a lot Nick! You're the best