Update Tabulator value with JS Callback

Panel
,
1

Hello all, I am attempting to link multiple slider values to a Tabulator value. I want to do this within a static HTML so a JS callback is required. The problem that I have is that in order to update table.value in my simple example below I need to pass a DataFrame object. When I try to do so in the .jscallback() I get the error:

SerializationError: can’t serialize <class ‘pandas.core.frame.DataFrame’>

If anyone have any idea how to work around this restriction I would really appreciate it.

import panel as pn
import pandas as pd
from bokeh.resources import INLINE
from bokeh.models.formatters import PrintfTickFormatter

pn.extension('tabulator')

# Silder Setup
slider_a = pn.widgets.FloatSlider(name='Slider A', 
                                        start = 1, end = 5,
                                        value = 1, step = 0.5,
                                        tooltips = False,
                                        format=PrintfTickFormatter(format='%.1f'))
slider_b = pn.widgets.FloatSlider(name='Slider B', 
                                        start = 1, end = 5,
                                        value = 1, step = 0.5,
                                        tooltips = False,
                                        format=PrintfTickFormatter(format='%.1f'))

# Tabulator Table Setup
df = pd.DataFrame()
df['Calculation'] = [1]
table =  pn.widgets.Tabulator(df)

# JS Callbacks
jscode = """copy_df['Calculation'][0] = (other_slider.value*cb_obj.value);
            table_df = copy_df;"""
slider_a.jscallback(value=jscode, 
                    args={'table_df': table.value,
                          'copy_df':table.value,
                          'other_slider':slider_b})
slider_b.jscallback(value=jscode, 
                    args={'table_df': table.value,
                          'copy_df':table.value,
                          'other_slider':slider_a})

# HTML Output
pn.Column(slider_a,slider_b,table).save('output.html', resources=INLINE)