cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Resolver I
Resolver I

Create custom slider for a custom visual plot

Hi guys,

 

i want to build a slider similar like in this picture here

 

Before i design the slider, i just want to read values dynamically from a simple textbox. I managed that without problems by creating a DOM-Element (input) with js

 

But as i try changing the value, it just stays static (it still returns the value 800) 😞

 

Does anyone have i idea how to read the values from an textbox when i change the value on it?

 

 

		private createHelpLinkElement3(): Element {
            let linkElement = document.createElement("input");
			linkElement.setAttribute("value", "800");
            linkElement.setAttribute("class", "helpLink3");
            return linkElement;
        };

 

 

Here you can download my project

 

1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
Community Champion
Community Champion

Re: Create custom slider for a custom visual plot

Hi @az2451

 

We'd recommend to bind a keypress event to catch each change:

this.helpLinkElement3.addEventListener("keypress", (event) => {
    this.getx = parseInt((event.target as HTMLInputElement).value);

    console.log(this.getx);
});

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

View solution in original post

2 REPLIES 2
Highlighted
Community Champion
Community Champion

Re: Create custom slider for a custom visual plot

Hi @az2451

 

We'd recommend to bind a keypress event to catch each change:

this.helpLinkElement3.addEventListener("keypress", (event) => {
    this.getx = parseInt((event.target as HTMLInputElement).value);

    console.log(this.getx);
});

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

View solution in original post

Highlighted
Resolver I
Resolver I

Re: Create custom slider for a custom visual plot

You are so amazing 🙂 

 

Thank you!

Helpful resources

Announcements
Community Blog

Community Blog

Visit our Community Blog for articles, guides, and information created by fellow community members.

Using the Community

Using the Community

Need help with the Power BI Community? Our 'Using the Community' support articles are a great place to start.

Community Summit North America

Community Summit North America

Innovate, Collaborate, Grow. The top training and networking event across the globe for Microsoft Business Applications

Power Platform 2020 release wave 2 plan

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Top Kudoed Authors