# Hi! Is there a way to interface with components via js? **URL:** \ **Category:** Ask us anything\ **Created:** [November 24, 2023, 7:47am UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541 "2023-11-24T07:47:54Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![Cam](https://avatars.discourse-cdn.com/v4/letter/c/bbe5ce/32.png) [@Cam](https://community.weweb.io/u/Cam)\ **Post date:** [November 24, 2023, 7:47am UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541/1 "2023-11-24T07:47:54Z")
To elaborate, I want to style my toggle button: I want this to have dynamic background colors depending on user selection. In the editor, the values are static, however. Since I can’t connect variables to these inputs, I’m hoping there is some way with vanilla js to interface with these components via some hidden API. Is there a way to ‘dynamically set static inputs’? (lol) ---
**Author:** ![Broberto](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/broberto/32/5918_2.png) [@Broberto](https://community.weweb.io/u/Broberto)\ **Post date:** [November 24, 2023, 8:58am UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541/2 "2023-11-24T08:58:52Z")
Use states for this) you can have conditions there. And also style children. ---
**Author:** ![Cam](https://avatars.discourse-cdn.com/v4/letter/c/bbe5ce/32.png) [@Cam](https://community.weweb.io/u/Cam)\ **Post date:** [November 24, 2023, 9:23am UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541/3 "2023-11-24T09:23:06Z")
Ideally, except the user is going to be selecting using the color picker and could chose a near infinite amount of options. Using states allows me to set up variants, but nothing truly freeform. Would you mind elaborating on styling children? ---
**Author:** ![Broberto](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/broberto/32/5918_2.png) [@Broberto](https://community.weweb.io/u/Broberto)\ **Post date:** [November 24, 2023, 10:10am UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541/4 "2023-11-24T10:10:29Z")
Could you show me what you’re trying to accomplish? I think you should be able to bind colors. ---
**Author:** ![Alexis](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/alexis/32/13248_2.png) [@Alexis](https://community.weweb.io/u/Alexis)\ **Post date:** [November 24, 2023, 11:46am UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541/5 "2023-11-24T11:46:52Z")
> In the editor, the values are static, however. Since I can’t connect variables to these inputs Nearly anything in our elements are dynamic and can be bound to data, do we forgot an essential property ? Can you show us what’s the exact property you want to make dynamic ? ---
**Author:** ![raydeck](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/raydeck/32/384_2.png) [@raydeck](https://community.weweb.io/u/raydeck)\ **Post date:** [November 24, 2023, 11:52am UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541/6 "2023-11-24T11:52:15Z")
You can subscribe to a weweb variable changing and use that to manually change a component’s CSS. We’ve done that kind of end-run before. So you have the option. Here’s the hardest part - subscribing to the variable. [![](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/8/862e80632d096d22701f5b81bcbe6cb54a9d4567.jpeg "Subscribing to Variable Changes in Weweb (@weweb\_io)") ](https://www.youtube.com/watch?v=IJkgBZKPxBc) That said, if there is a more no-code solution I would go for it - if @alexis can help with a more direct connection on the panel, go that way. I love working with powertools but you don’t need a backhoe to plant a flower. (At least not a small one!) ---
**Author:** ![Cam](https://avatars.discourse-cdn.com/v4/letter/c/bbe5ce/32.png) [@Cam](https://community.weweb.io/u/Cam)\ **Post date:** [November 24, 2023, 6:25pm UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541/7 "2023-11-24T18:25:29Z")
@Broberto @Alexis ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/e/e8f1d7b3440276525212098faf0b93487479a25e.png) Hey guys - this is the panel I’d like to link values to, but I can’t. I’ll have to explore Ray’s solution 🙂 To clarify: they are NOT traditionally static, they are static as in ‘you can’t bind values’. ---
**Author:** ![Cam](https://avatars.discourse-cdn.com/v4/letter/c/bbe5ce/32.png) [@Cam](https://community.weweb.io/u/Cam)\ **Post date:** [November 24, 2023, 8:20pm UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541/8 "2023-11-24T20:20:16Z")
I was able to work around this by changing the background color if the toggle is enabled. Native integration would be super cool, but I totally understand if it’s not a priority! I _did_ have to use light js as the background-color property doesn’t seem to have any effect. It must be looking at those specific value values. For anyone following my path, I used ```auto var selector = wwLib.getFrontDocument.getElementById('myelement'); if (toggle) { selector.style.backgroundColor = myUsersColorSelection } else { selector.style.backgroundColor = yourDefaultColor; } ``` I have a tendency to overcomplicate things, so by all means if you find another way, let me know! ---
**Author:** ![Alexis](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/alexis/32/13248_2.png) [@Alexis](https://community.weweb.io/u/Alexis)\ **Post date:** [November 25, 2023, 7:21pm UTC](https://community.weweb.io/t/hi-is-there-a-way-to-interface-with-components-via-js/5541/9 "2023-11-25T19:21:59Z")
Oh it seems like we forgot to make them bindable, to be honest I would consider it as a bug, so if you create a ticket on [support.weweb.io](http://support.weweb.io) we will try to handle it in the next couple of days 🙂 Edit : By looking at the color property behavior (opening a huge modal) I think this component is very very old, that’s why, it need a little refresh! But well done for doing it with javascript, its a nice workaround