RadioButtonGroup is unsynchronized with click

I am trying to update the style of a plot based on the state of a button. I started by experimenting with pn.widgets.RadioButtonGroup with two states: on and off. I found that when I click one of the states, the response is unsyncronized relative to the state clicked.

Here is my code, which is based in one the tutorials I found after googling the issue:


import panel as pn

off_on = pn.widgets.RadioButtonGroup(options=['off','on'], value='off')

@pn.depends(off_on)
def get_value(off_on):
    return off_on

widget = pn.Column("My button", off_on)
out = pn.Row(widget, pn.WidgetBox(get_value, width=300))
out.show()

Here there is a video: https://youtu.be/Ndman8eKbvw

Here’s how I would do it:

import panel as pn

off_on = pn.widgets.RadioButtonGroup(options=['off','on'], value='off')
text_box = pn.widgets.TextInput(value="off", disabled=True)

def get_value(event):
    text_box.value = event.new

off_on.param.watch(get_value, "value")
pn.Column(off_on, text_box)

Thanks @ahuang11! Your example worked fine. Now I am trying to apply it to a plot, to control the visibility of the data. So far I have this:

off_on = pn.widgets.RadioButtonGroup(value='on', options=['on','off'])
text_box = pn.widgets.TextInput(value="on", disabled=True)

df = pd.DataFrame({
    "x": [1,2,3],
    "y": [1,2,3],
})
plot = df.hvplot.points(x="x", y="y")
# @pn.depends()
def get_value(event):
    text_box.value = event.new
    if event.new == 'off':
        plot.opts(alpha=0)
    else:
        plot.opts(alpha=1)    

off_on.param.watch(get_value, "value")
out = pn.Row(plot, pn.Column(off_on,text_box))
out.show()

The switch and texbox work as in your example, but it does not affect the plot option (alpha in this case). From other examples I have seen, I think I need to use a decorator somewhere but I am not sure (I just started using holoviz).

Check out:
https://pydeas.readthedocs.io/en/latest/holoviz_interactions/tips_and_tricks.html