question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

RangeSlider css_classes not being updated anymore

See original GitHub issue

It seems in 0.12.7 the css_classes attribute of the RangeSlider is not being updated anymore by the callbacks. It was working in 0.12.6. In the example below, both the text input and the slider starts with the initial class as expected. When the slider changes, both should gain the sent-later class, but only the text input is gaining it…

from bokeh.io import curdoc
from bokeh.models import TextInput, RangeSlider
from bokeh.layouts import widgetbox
from bokeh.layouts import column
from bokeh.models import Div

div1 = Div(text="""
        <style>
        .sent-later {
            border-radius: 0.5em;
            padding: 1em;
            border: 3px solid #2397D8;
        }
        </style>
""")


def on_slider_change(attr, old, new):
    slider.css_classes.append('sent-later')
    text.css_classes.append('sent-later')
    print(slider.css_classes)
    print(text.css_classes)


text = TextInput(
        value=str(2),
        title='Population Beta:')

slider = RangeSlider(
        start=0,
        end=10,
        value=(0, 2),
        step=1,
        title='Population Beta')

slider.css_classes = []
slider.css_classes.append('initial')
text.css_classes = []
text.css_classes.append('initial')

slider.on_change('value', on_slider_change)

curdoc().add_root(column(div1, widgetbox(text, slider)))

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:8 (8 by maintainers)

github_iconTop GitHub Comments

1reaction
bryevdvcommented, Aug 30, 2017

@andresmrm The entire slider widget implementation was replace so that we could jettison jquery entirely. Thanks for your patience.

@mattpap I suspect it’s this:

https://github.com/bokeh/bokeh/blob/master/bokehjs/src/coffee/models/widgets/abstract_slider.coffee#L24-L26

Looks like render (whose super is what calls _render_classes) will only ever be called once.

0reactions
bryevdvcommented, Nov 8, 2017

The route suggested above works,I will create a PR

Read more comments on GitHub >

github_iconTop Results From Across the Web

A Sliding Nightmare: Understanding the Range Input
In Chrome, at the top of the shadow DOM, we have a div we cannot access anymore. This used to be possible back...
Read more >
How to Create a Range Slider in HTML + CSS - HubSpot Blog
We will call this class in our CSS file. <input type="range"> - The "range" input type allows you to specify a numeric value...
Read more >
How to display a range input slider vertically - Stack Overflow
This solution is based on current browser implementations of as yet still undefined or unfinalized CSS properties. If you intend to use it...
Read more >
<input type="range"> - HTML: HyperText Markup Language
elements of type range let the user specify a numeric value which must be no less than a given value, and no more...
Read more >
Creating A Range Slider in HTML using JavaScript
Range Sliders are used on web pages to allow the user specify a numeric value which must be no less than a given...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found