R dateInput - clearing field by clicking "X" doesn't clear input value

Question

I've come across an issue where clicking the "X" at the end of a dateInput field clears the field itself, but does not record the input value as a blank or NA.

Take this example:

library(shiny)

ui <- fluidPage(
  headerPanel("Example"),
  
  mainPanel(
    
    # input field
    dateInput("user_text", label = "Date:", value = NA),
    
    # display text output
    textOutput("text"))
)

server <- function(input, output) {
  
  # reactive expression
  text_reactive <- reactive({
    format(input$user_text)
  })
  
  observe({
    print(format(input$user_text))
  })
  
  # text output
  output$text <- renderText({
    text_reactive()
  })
}

shinyApp(ui = ui, server = server)

Selecting a date prints the date to output$text and the console. Highlighting the date and pressing delete or backspace on the keyboard correctly clears the value from the cell and records "" as the value for output$text. Instead of using backspace or delete to clear the value, click the "X" at at the end of the dateInput field. This correctly clears the field itself, but leaves the last selected date as the value for output$text.

Is this a bug or is there a way to make clicking the "X" set the value of output$text to ""?

The only browser where I see an "X" is Internet Explorer which is never a first choice. In Chrome, Firefox and Edge there is no "X" and personally I would suggest creating Shiny apps for modern and more commonly used browsers. You could recreate the "X" idea separately I guess. — Eli Berkow, Sep 22 '20 at 07:27
Unfortunately, Explorer is the only approved browser at my company at this time. — lumiukko, Sep 22 '20 at 11:12
That is unfortunate. Seems like a legacy option and the app is not reacting to that "X" in any way which makes it difficult to use. Hopefully someone else can help or maybe it can be hidden. — Eli Berkow, Sep 22 '20 at 13:56
https://docs.microsoft.com/en-us/troubleshoot/browsers/how-to-hide-clear-button-ie-10 — Eli Berkow, Sep 22 '20 at 14:06

score 1 · Accepted Answer · answered Sep 22 '20 at 14:18

I know this was not your original question but the "X" only appears in IE 10 & 11 - see How to hide the Clear button in Internet Explorer 10. It doesn't seem to affect reactives/observes in Shiny unless I am missing something but it can be removed. See this answer and some of the others to that question.

library(shiny)

ui <- fluidPage(
    headerPanel("Example"),
    
    mainPanel(
        
        # input field
        dateInput("user_text", label = "Date:", value = NA),
        
        # display text output
        textOutput("text")),
    tags$style('::-ms-clear { display: none; }')
)

server <- function(input, output) {
    
    # reactive expression
    text_reactive <- reactive({
        format(input$user_text)
    })
    
    observe({
        print(format(input$user_text))
    })
    
    # text output
    output$text <- renderText({
        text_reactive()
    })
}

shinyApp(ui = ui, server = server)

The added line is tags$style('::-ms-clear { display: none; }')

R dateInput - clearing field by clicking "X" doesn't clear input value

1 Answers1