Date Selector

#| standalone: true
#| components: [viewer]
#| viewerHeight: 380

## file: app.py

from shiny import App, render, ui

app_ui = ui.page_fluid(
    ui.input_date("date", "").add_class("pt-5 mx-auto text-center"),
    ui.output_text("value"),
    {"class": "vh-100 justify-content-center align-items-center px-5"},
).add_class("my-auto text-center")

def server(input, output, session):
    @output
    @render.text
    def value():
        return input.date()

app = App(app_ui, server)
from shiny import render
from shiny.express import input, ui

ui.input_date("date", "Date")  

@render.text
def value():
    return input.date()
from shiny import App, render, ui

app_ui = ui.page_fluid(
    ui.input_date("date", "Date"),  
    ui.output_text("value"),
)

def server(input, output, session):
    @render.text
    def value():
        return input.date()

app = App(app_ui, server)
No matching items

Relevant Functions

  • ui.input_date
    ui.input_date(id, label, *, value=None, min=None, max=None, format='yyyy-mm-dd', startview='month', weekstart=0, language='en', width=None, autoclose=True, datesdisabled=None, daysofweekdisabled=None)

No matching items

Details

A date selector allows you to select a date from a calendar.

To add a date selector to your app:

  1. Add ui.input_date() to the UI of your app to create a date selector. Where you call this function will determine where the date selector will appear within the app’s layout.

  2. Specify the id and label parameters of ui.input_date() to define the identifier and label of the date selector. ui.input_date() also includes various optional parameters, including min and max, which set the minimum and maximum allowed dates.

The value of an input component is accessible as a reactive value within the server() function. To access the value of a date selector:

  1. Use input.<date_id>() to access the value of a daterange selector (e.g., input.date()). The server value of a date selector is a date object.

See also: Date Range Selector