Rendering error when dynamically adding sliders

[dhm116]

If I dynamically add a slider to the page, it does not seem to render correctly unless I switch to a different browser tab. Perhaps I'm doing something terribly wrong.

Coffeescript for adding a slider to an existing input of given name:

createSlider = (name) ->
    fdSlider.createSlider({
        inp:document.getElementById(name)
        step:1
        maxStep:1
        min:0
        max:100
        animation:'tween'
        forceValue:true
        callbacks: {
            "change":[updateValue]
            "create":[sliderCreated]
        }
    })

The input the slider is being created for is also being dynamically added via a jQuery template, so that may be convoluting things.

Again, if I simply switch to another browser tab and back, it works fine, so that would lead me to believe there's some issue with how it's being (re)drawn. Is there a way to manually call redraw() on the slider within the create event?

[dhm116]

Actually, it's even weirder....the sliders won't render correctly unless I open the developer console on chrome. If that isn't open, they won't render correctly even if I switch tabs.

[freqdec]

It looks like a problem with the redraw code (that only redraws if the body has changed its width or height). I need to remove the body width/height test and force a redraw. I shall take a look during the week and hopefully commit a fix.

Thanks for taking the time to create the issue.

[freqdec]

Quick update: I created a testcase last night and shall check it in chrome tonight (didn't have time last night). It doesn't look like my initial assumption on the redraw code was correct. Shall update with testcase findings later.

[freqdec]

Well, I can't seem to reproduce the problem. I've added a testcase to the repository that enables you to dynamically add sliders but it won't misbehave in Chrome. Can you check the updated demo to see if the problem persists?

In an attempt to narrow investigation: Are you reusing an id previously used by another slider i.e. are you creating a slider, removing it from the dom (after the return from an Ajax call for example) and then replacing it with a fresh slider?

Also, you could try to use the updateSlider method to force a redraw.

[freqdec]

Closing the issue as I can't reproduce.