How to create a Range Slider Widget?

[JanC]

Hey there,
I’m looking for a Range Slider Widget that would output the lower and upper selected values as variables. Basically the same behaviour as the Slider Widget but for a range.

I tried the Interactive Ranger Slider Filter Widget but this one does not output any variables. I would need use those variables in a Rule Based Row filter. Also the Interactive Ranger Slider Filter Widget does not seem to work when connected to Table View (only Table View JavaScript seems to work).

Thanks in advance

[rfeigel]

Here’s a way to create flow variables. There’s probably a more elegant way, but this seems to work. Can’t help with the view problem. I’ve had similar issues myself.
Interactive Filter Widget.knwf (124.2 KB)

[JanC]

So if I understand correctly. In your component, you

• apply the Interactive Range Slider directly to the Data column
• display this same Data in your scatter plot
• extract the Upper and Lower variables from the scatter plot table into the variables

In my case, I’d like to do the opposite:

• adjust the sliders
• get the selected slider values
• use those upper/lower value of the slider to do some fitering on the data.
• display the filtered data

I need to apply filter on more than one column so that’s why I can’t use the out of the box behaviour of the interactive range slider.

anyway, thanks for the help!

[rfeigel]

I think you didn’t understand the structure of the workflow. The scatter plot does nothing. I just added it as a visual QA check. The key is the workflow creates upper and lower bound flow variables which can be used downstream as you need. Try this:
Interactive Filter Widget rev 1.knwf (150.8 KB)

[Neha_Kakkar]

Hi everyone,
I’m also trying to create a range slider widget to output lower and upper values as variables for filtering multiple columns. I’ve explored the Interactive Range Slider Filter Widget but faced similar issues with variable output and table view compatibility.

Is there a way to modify the widget or combine components to achieve this functionality?

[rfeigel]

Try the second workflow I posted.

[JanC]

@rfeigel thanks for the explanations

I now have access to the variables of the Upper and Lower and can use them in an expression based filter.

The only issue now is that the final table is not refreshing when I move the slider.

Interactive Filter Widget rev 1.knwf (150.8 KB)

I believe it’s a similar issue to my other question Interactive Range Slider Filter Widget does not refresh a Table View

[rfeigel]

You’ve got to apply the new slider values. I’ve checked and it works fine.

[JanC]

yes that works but I’d like the filter to be applied when I change the value in the interactive view of the entire component (using F10)

[rfeigel]

I don’t think that’s currently possible. Maybe someone more familiar with MUI shortcuts can weigh in.

[rfeigel]

Here’s a workflow with filters for single and multiple columns. You can choose either a standard row filter or Expression Row Filter if you’re using KAP 5.4. You can delete what you don’t want. It also employs the Table View node.
Interactive Filter Widget rev 2.knwf (216.8 KB)