A button that sends back the same value every time that it is clicked.

You can use it to trigger reactive cells.

Examples

In one cell:

@bind go Button("Go!")

and in a second cell:

begin
    # reference the bound variable - clicking the button will run this cell
    go

    md"My favorite number is 0.5214400611460621!"
end

A checkbox to choose a Boolean value true/false.

Examples

@bind programming_is_fun CheckBox()

@bind julia_is_fun CheckBox(default=true)

md"Would you like the thing? $(@bind enable_thing CheckBox())"

A date input (<input type="date">) - the user can pick a date, the date is returned as Dates.DateTime via @bind.

Use default to set the initial value.

See the Mozilla docs about <input type="date">

Examples

@bind secret_poem DateField()

@bind secret_poem DateField(default="Te dansen omdat men leeft")

Button to download a Julia object as a file from the browser.

See DownloadButton to do the opposite.

Examples

DownloadButton("Roses are red,", "novel.txt")

DownloadButton(UInt8[0xff, 0xd8, 0xff, 0xe1, 0x00, 0x69], "raw.dat")

import JSON
DownloadButton(JSON.json(Dict("name" => "merlijn", "can_cook" => true)), "staff.json")

A file upload box. The chosen file will be read by the browser, and the bytes are sent back to Julia.

The optional accept argument can be an array of MIMEs. The user can only select files with these MIME. If only image/* MIMEs are allowed, then smartphone browsers will open the camera instead of a file browser.

Examples

@bind file_data FilePicker()

file_data["data"]

You can limit the allowed MIME types:

@bind image_data FilePicker([MIME("image/jpg"), MIME("image/png")])
# and use MIME groups:
@bind image_data FilePicker([MIME("image/*")])

A multi-selector (<select multi>) - the user can choose one or more of the options, an array of `Strings.

See Select for a version that allows only one selected item.

options can also be an array of pairs key::String => value::Any. The key is returned via @bind; the value is shown.

See the Mozilla docs about select

Examples

@bind veg MultiSelect(["potato", "carrot"])

@bind veg MultiSelect(["potato" => "🥔", "carrot" => "🥕"])

@bind veg MultiSelect(["potato" => "🥔", "carrot" => "🥕"], default=["carrot"])

A box where you can type in a number, within a specific range.

Examples

@bind x NumberField(1:10)

@bind x NumberField(0.00 : 0.01 : 0.30)

@bind x NumberField(1:10; default=8)

A password input (<input type="password">) - the user can type text, the text is returned as String via @bind.

This does not provide any special security measures, it just renders black dots (•••) instead of the typed characters.

Use default to set the initial value.

See the Mozilla docs about <input type="password">

Examples

@bind secret_poem PasswordField()

@bind secret_poem PasswordField(default="Te dansen omdat men leeft")

A group of radio buttons - the user can choose one of the options, an array of Strings.

options can also be an array of pairs key::String => value::Any. The key is returned via @bind; the value is shown.

Examples

@bind veg Radio(["potato", "carrot"])

@bind veg Radio(["potato" => "🥔", "carrot" => "🥕"])

@bind veg Radio(["potato" => "🥔", "carrot" => "🥕"], default="carrot")

Resource(src::String, mime=mime_from_filename(src)[, html_attributes::Pair...])

A container for a URL-addressed resource that displays correctly in rich IDEs.

Examples

Resource("https://julialang.org/assets/infra/logo.svg")

Resource("https://interactive-examples.mdn.mozilla.net/media/examples/flower.webm", :width => 100)

md"""
This is what a duck sounds like: $(Resource("https://interactive-examples.mdn.mozilla.net/media/examples/t-rex-roar.mp3"))
md"""

A dropdown menu (<select>) - the user can choose one of the options, an array of Strings.

See MultiSelect for a version that allows multiple selected items.

options can also be an array of pairs key::String => value::Any. The key is returned via @bind; the value is shown.

See the Mozilla docs about select

Examples

@bind veg Select(["potato", "carrot"])

@bind veg Select(["potato" => "🥔", "carrot" => "🥕"])

@bind veg Select(["potato" => "🥔", "carrot" => "🥕"], default="carrot")

A Slider on the given range.

Examples

@bind x Slider(1:10)

@bind x Slider(0.00 : 0.01 : 0.30)

@bind x Slider(1:10; default=8, show_value=true)

A text input (<input type="text">) - the user can type text, the text is returned as String via @bind.

If dims is a tuple (cols::Integer, row::Integer), a <textarea> will be shown, with the given dimensions

Use default to set the initial value.

See the Mozilla docs about <input type="text"> and <textarea>

Examples

@bind poem TextField()

@bind poem TextField((30,5); default="Hello JuliaCon!")

A time input (<input type="time">) - the user can pick a time, the time is returned as Dates.DateTime via @bind.

Use default to set the initial value.

See the Mozilla docs about <input type="time">

Examples

@bind secret_poem TimeField()

@bind secret_poem TimeField(default="Te dansen omdat men leeft")

Create a Resource for a local file (a base64 encoded data URL is generated).

WARNING

LocalResourcewill not work when you share the script/notebook with someone else, unless they have those resources at exactly the same location on their file system.

Recommended alternatives (images)

1. Go to imgur.com and drag&drop the image to the page. Right click on the image, and select "Copy image location". You can now use the image like so: PlutoUI.Resource("https://i.imgur.com/SAzsMMA.jpg").
2. If your notebook is part of a git repository, place the image in the repository and use a relative path: PlutoUI.LocalResource("../images/cat.jpg").

Examples

Resource("./cat.jpg")

Resource("/home/fons/Videos/nijmegen.mp4", :width => 200)

md"""
This is what a duck sounds like: $(Resource("../data/hannes.mp3"))
md"""

Attempt to find the MIME pair corresponding to the extension of a filename. Defaults to text/plain.

Run the function, and capture all messages to stdout. The result will be a small terminal displaying the captured text.

This allows you to to see the messages from println, dump, Pkg.status, etc.

Example:

with_terminal() do
    x=1+1
    println(x)
    @warn "Oopsie!"
end 

with_terminal(dump, [1,2,[3,4]])