Creating Radio Buttons in Jupyter NoteBook (Markdown part)

Viewed 222

I have been able to add some HTML in my Jupyter Notebook (run on Collab) in the Markdown (Text) part by just adding the HTML code:

  <input type="radio" id="html" name="fav_language" value="HTML">
  <label for="html">HTML</label><br>
  <input type="radio" id="css" name="fav_language" value="CSS">
  <label for="css">CSS</label><br>
  <input type="radio" id="javascript" name="fav_language" value="JavaScript">
  <label for="javascript">JavaScript</label>

I wanted to add some radio buttons: they display correctly code and rendering

... but they behave as "checkboxes" (i.e. you can have several selection).

several selection

Maybe it's because the CSS part is not handled properly or the name is not stored?

Anyhow, any idea on how to have proper rendering of radio buttons?

Thanks

1 Answers

Probably later than you needed for an answer, but in case others come here with a similar question, I find it works better to use widgets rather than raw HTML form elements. For example:

from ipywidgets import interact, interact_manual, widgets

fav_lang_w = widgets.RadioButtons(
    options=['HTML', 'CSS', 'javascript'],
    value='CSS' #said no one ever
)
def update_lang():
    global fav_lang
    fav_lang = fav_lang_w.value
    display('your favorite language is ' + fav_lang)

submit_btn = interact_manual(update_misc)
submit_btn.widget.children[0].description = 'Submit'
display(submit_btn)
display(fav_lang_w)
Related