Sync location

Download this notebook from GitHub (right-click to download).

In [ ]:
import panel as pn

This example demonstrates how to sync widget state with the URL bar, restoring it from the URL parameters on page load and updating it when the widgets change. Note this example will only work when served with panel serve. In a notebook pn.state.location does not exist until after the first object has been displayed:

In [ ]:
widget = pn.widgets.FloatSlider(name='Slider', start=0, end=10)
widget2 = pn.widgets.TextInput(name='Text')
widget3 = pn.widgets.RangeSlider(name='RangeSlider', start=0, end=10)

if pn.state.location:
    pn.state.location.sync(widget, {'value': 'slider_value'})
    pn.state.location.sync(widget2, {'value': 'text_value'})
    pn.state.location.sync(widget3, {'value': 'range_value'})

pn.Row(widget, widget2, widget3).servable()

Download this notebook from GitHub (right-click to download).