Updating attribute data using "Instance.data.."

So I’ve been working on a Video plugin recently, but I’ve run into a problem which I can’t seem to resolve so hoping someone might be able to help me.

What I’m trying to do is update a data attribute called data-setup that’s initially created during the initialize function as shown below. I’m creating the div using instance.canvas.append and I’ve set the JSON object variable and just injected it in. It’s this object which I want to then update further down the line using various properties.blah values.

I have this section below with the initialize function:

And I have this within the update function:

When you look at the element after it’s been created in the browser, it will look like the below but since in my update function I’m specifying an options object variable and then using that to update instance.data.options, I was hoping the color value would update from “white” to “red” but unfortunately it doesn’t.

Can someone point out what I’m doing wrong here? I understand there’s probably a few ways to do this, I’ve tried a few over the last few days but nothing that’s made any difference. I’m hoping to make the values burried within the data-setup attribute configurable so I can start to manipulate the options.


@sudsy, @jacobgershkovich, @exception-rambler, @Jici
Tagging you guys because I reakon you maybe able to help! (hope you don’t mind) :slight_smile:


I’ve managed to make it work as I wanted with these.



Which now results in…

So I’m happy as it updates as necessary.
A change to the colour from white to red for example should make the current video player’s progress bar (which is now using youtube controls) change. Only thing is although the data object is now updating, the player controls doesn’t. It shows red if I specify it directly in the initialize section but doesn’t reflect the change in the update.

I’m sure I’ll figure it out, maybe a cache issue or it needs reloading or something.