Tabulator on_click() to load a new page

Hi, I’m new to Panel. I would like to be able to click on a cell in Tabulator and have it bring up another page. I’m able to use on_click() to determine the target cell, but I don’t know what the easiest way or recommended way to bring up a new page is, eg. calling http://localhost:5006/app2.

Thanks,
Andy

Hi Andy

Here a get solution(may not be a good one), you can use
table =pn.widgets.Tabulator(df,selectable=‘checkbox’)

Here is an example:

import pandas as pd
import panel as pn
import numpy as np
pn.extension('tabulator',sizing_mode="stretch_width")

# generate a dataframe
df = pd.DataFrame(np.random.randn(10, 4), columns=['A','B','C','D'])
# define a Tabulator
table = pn.widgets.Tabulator(df,selectable='checkbox',hidden_columns  = ['index'])
#define a area to show selected,
text_area_input = pn.widgets.input.TextAreaInput(name='Text Area Input', placeholder='Enter a string here...')
# call back function, could be replace by button.on_click()
def selected_callback(obj,event):
    obj.value = str(table.selection)
#link funtion to link the widgets
table.link(text_area_input,callbacks={'selection': selected_callback})    
#loyout
pn.Row(table,text_area_input)

I was trying to use the on_click() before,but it seem make the whole widgets clickable.I am also looking for some batter solution here :grinning:

Kind regadrs
Victor

Hi @CongTang,
Thank you for responding. I’m not sure your solution does what I’m looking for. I am OK with using on_click() to set the callback function for the Tabulator grid. I would like this callback to invoke another Panel app page. From a button, I can call the following to bring up a new page.

    btn.js_on_click(code="""window.open("./app2", "_self")""")

In the Tabulator on_click(), I can retrieve the row/column of selected cell. I would then like to bring up a new page based on that. Any idea? --Thanks

Hi Andy

if you looking for open a new web page:

try this:

if you look at something replace the current page, you could try:

import panel as pn
pn.extension()

# first page
app = pn.Row(pn.Spacer(background = 'red',height = 200,width = 200))
# second page 
app2 = pn.Row(pn.Spacer(background = 'blue',height = 200,width = 200))

# define a button and click function
button = pn.widgets.Button(name = 'cilck me')
def click_function(event):
    app.clear()
    app.append(app2)
button.on_click(click_function)
#'layout    
pn.Column(app,button)

hopefully this could help you :grinning:

Kind regadrs
Victor

1 Like

Thanks Victor. Yes I think I’ll restructure my code to use the clear() approach. The transition seems to be cleaner.

1 Like