Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

July 7 - July 17 | Round 2 of the Power BI Dataviz World Championships. Don't miss your chance! Learn more

Reply
az2451
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
v-viig
Community Champion
Community Champion

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

[email protected]

View solution in original post

2 REPLIES 2
v-viig
Community Champion
Community Champion

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

[email protected]

You are so amazing 🙂 

 

Thank you!

Helpful resources

Announcements
FabCon and SQLCon Barcelona 2026

FabCon & SQLCon – Barcelona 2026

Join us in Barcelona for FabCon and SQLCon, the Fabric, Power BI, SQL, and AI community event. Save €200 with code FABCMTY200.

60 days of Data Days Carousel

Data Days 2026

Join Fabric Data Days 2026: 60 days of free live/on-demand sessions, challenges, study groups, and certification opportunities.

Power BI DataViz World Championships carousel

Power BI DataViz World Championships - June 2026

A new Power BI DataViz World Championship is coming this June! Don't miss out on submitting your entry.

Top Solution Authors