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
August 2020 Community Challenge: Can You Solve These?

August 2020 Community Challenge: Can You Solve These?

We're excited to announce our first cross-community 'Can You Solve These?' challenge!

Community Blog

Community Blog

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

Upcoming Events

Upcoming Events

Wondering what events you could join or have an event to promote yourself? Check out our Upcoming Events.

Get Ready for Power BI Dev Camp

Get Ready for Power BI Dev Camp

We are thrilled to announce we will begin running a monthly webinar series named Power BI Dev Camp.