Bokeh: Display user input text

Question

I am trying to figure out how to display a user's input with Bokeh. Sample code is below. Any pointers would be greatly appreciated.

Thank you

from bokeh.layouts import widgetbox
from bokeh.models import CustomJS, TextInput, Paragraph
from bokeh.plotting import output_file, show

# SAVE
output_file('Sample_Application.html',mode='inline',root_dir=None)

# PREP DATA
welcome_message = 'You have selected: (none)'

# CALLBACKS
def callback_print(source=None, window=None):
    user_input = str(cb_obj.value)
    welcome_message = 'You have selected: ' + user_input
    source.trigger('change')

# TAKE ONLY OUTPUT
text_banner = Paragraph(text=welcome_message, width=200, height=100)

# USER INTERACTIONS
text_input = TextInput(value="", title="Enter row number:",             
callback=CustomJS.from_py_func(callback_print))

# LAYOUT
widg = widgetbox(text_input, text_banner)
show(widg)

Anthonydouc · Accepted Answer · 2017-05-22 10:05:44Z

5

Few issues, you need to actually pass in the text banner object into the python callback,and update the text attribute to the new string.

Currently you are passing in "source", which is undefined and trying to trigger a change. Normally you do this when you change the data of a source and update it to display on a table or plot etc...

Included below the necessary fix

from bokeh.layouts import widgetbox
from bokeh.models import CustomJS, TextInput, Paragraph
from bokeh.plotting import output_file, show

# SAVE
output_file('Sample_Application.html',mode='inline',root_dir=None)

# PREP DATA
welcome_message = 'You have selected: (none)'

# TAKE ONLY OUTPUT
text_banner = Paragraph(text=welcome_message, width=200, height=100)

# CALLBACKS
def callback_print(text_banner=text_banner):
    user_input = str(cb_obj.value)
    welcome_message = 'You have selected: ' + user_input
    text_banner.text = welcome_message

# USER INTERACTIONS
text_input = TextInput(value="", title="Enter row number:",             
callback=CustomJS.from_py_func(callback_print))

# LAYOUT
widg = widgetbox(text_input, text_banner)
show(widg)

answered May 22, 2017 at 10:05

Anthonydouc

3,3641 gold badge18 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Marc Compere Over a year ago

this is helpful but I'm getting a pscript error from the CustomJS call. I'd like a solution that (works and) does not require CustomJS

Marc Compere · Accepted Answer · 2020-04-30 18:48:35Z

the answer from @Anthonydouc was helpful but did not work on my bokeh 1.4.0 installation because of the CustomJS call.

A similar solution that works on 1.4.0 and probably bokeh 2.0 is posted here:

from bokeh.models import TextInput, Paragraph
from bokeh.plotting import curdoc
from bokeh.layouts import layout

myMessage = 'You have entered nothing yet: (none)'
text_output = Paragraph(text=myMessage, width=200, height=100)

def my_text_input_handler(attr, old, new):
    myMessage="you just entered: {0}".format(new)
    text_output.text=myMessage # this changes the browser display

text_input = TextInput(value="default", title="Label:")
text_input.on_change("value", my_text_input_handler)

layout = column(text_input,text_output)

curdoc().add_root(layout)
curdoc().title = "Bokeh text input example with text echo"

The only way to get the .on_change() events to work is with bokeh serve, so run like this:

bokeh serve --show text_input_example_with_display.py

Collectives™ on Stack Overflow

Bokeh: Display user input text

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related