UI elements for selecting date and time (not just date) in shiny

Question

In the past I have used a combination of dateInput and a slider to get date and hour for my shiny app. I was wondering if there is a better option available now as I need to collect input up to the minute.

Searching online did not help so asking SO.

Thanks

Answer 1

You can now use the package shinyTime to intuitively input time into a Shiny App. At the moment it works with separate numeric inputs, that together make up time in the %H:%M or %H:%M:%S format. Getting and setting the value in R is done with a DateTime object.

Example usage (also see the example on shinyapps):

library(shiny)
library(shinyTime)

ui <- fluidPage(

   titlePanel("shinyTime Example App"),

   sidebarLayout(
      sidebarPanel(
        timeInput("time_input", "Enter time", value = strptime("12:34:56", "%T"))
      ),

      mainPanel(
        textOutput("time_output")
      )
   )
)

server <- function(input, output, session) {
  output$time_output <- renderText(strftime(input$time_input, "%T"))
}

shinyApp(ui, server)

Disclaimer: I am the package author. Feedback and suggestions most welcome!

Answer 2

Its been quite sometime since this question has been posed but I'm guessing it remains relevant since I haven't been able to find a satisfactory answer to retrieve time inputs.

Below are 3 examples to retrieve a time input.

1. The first is what I believe most people, myself included, had been or are looking for. A shiny like input time object for time input retrieval. It uses the HTML time input:< input id='ui_time' type='time'> followed by some simple javascript function to retrieve the input data before passing to the Shiny.onInputChange() function to pass as an input to the Shiny server.

   <input id="ui_time" type="time">

   '<script> document.getElementById("ui_time").onchange = function() { var time = document.getElementById("ui_time").value; Shiny.onInputChange("input_html", time); }; </script>'

2. The second, which is probably not desired but sticks to the use of sliders, is a simple but cumbersome hack to create 2 sliders, one to register the time and another to register the minutes before concatenating the 2 results to return a proper time input.

   sliderInput("slider_hours", "Hours:", min=0, max=23, value=0, step = 1), sliderInput("slider_mins", "Mins:",min = 0, max = 59, value = 0, step = 1)

3. Lastly, if date and time formats are required, some may not be aware, as I had not, that the slider does accept date time inputs as POSIXt objects. In this case, a slider input can be constructed as follows:

   sliderInput("slider_datetime", "Date & Time:", min=as.POSIXlt("2010-01-01 00:00:00", "GMT"), max=as.POSIXlt("2020-01-01 23:59:59", "GMT"), value=as.POSIXlt("2010-01-01 00:00:00", "GMT"), timezone = "GMT")

For those less familiar with shiny or html, you can view a functional sample code at my github: https://github.com/krenova/Shiny_TimeInput/blob/master/app.R

or simply run the following gist in R:

runGist('https://gist.github.com/krenova/fc184de17892905182a422c96117e989')

I'm new to shiny and html, picked it up just last week, so please bear in mind that I may not have done things in the most appropriate manner. In any case, I hope the above saves someone hours of time!