Home > Enterprise >  Hide text input and button after click
Hide text input and button after click

Time:04-30

I am new with Shiny. I have developed a very simple app that modifies a string inserted in a text input after the click of a button. The result appears in a text output present from the beginning. This is my code:

# ui.R

library(shiny)
library(shinyjs)

ui <- fluidPage(
  useShinyjs(),
  textInput("caption", "Caption", "abc"),
  actionButton("btn_input", "Enter"),
  verbatimTextOutput("value")
)

# server.R

library(shiny)
library(shinyjs)

server <- function(input, output) {
    output$value <- reactive({
        # toggle(id="caption")
        input$btn_input
        v <- isolate({input$caption})
        if (v == "xxx") {
            value <- paste(v, "a")
        } else {
            value <- paste(v, "b")
        }
        value
    })
}

I would like the text output to appear only after clicking the button. At the same time I would like the caption, the text input and the button to disappear after clicking the button.

What is the easiest way to make this change? Thanks in advance.

CodePudding user response:

I think conditionalPanel is the easiest way:

library(shiny)

ui <- fluidPage(
  conditionalPanel(
    "input.btn_input === 0",
    textInput("caption", "Caption", "abc"),
    actionButton("btn_input", "Enter")
  ),
  conditionalPanel(
    "input.btn_input !== 0",
    style = "display: none;",
    verbatimTextOutput("value")
  )
)


server <- function(input, output) {
  
  Value <- eventReactive(input$btn_input, {
    v <- input$caption
    if (v == "xxx") {
      paste(v, "a")
    } else {
      paste(v, "b")
    }
  })
  
  output$value <- renderPrint({
    Value()
  })
}

shinyApp(ui, server)

If you want a "Back" button, as asked in your comment, you can proceed as follows:

library(shiny)

ui <- fluidPage(
  conditionalPanel(
    "output.show_input",
    textInput("caption", "Caption", "abc"),
    actionButton("btn_input", "Enter")
  ),
  conditionalPanel(
    "output.show_output",
    style = "display: none;",
    verbatimTextOutput("value"),
    actionButton("btn_back", "Back")
  )
)


server <- function(input, output) {
  
  ShowInput <- reactiveVal(TRUE)
  output$show_input <- reactive({
    ShowInput() 
  })
  outputOptions(output, "show_input", suspendWhenHidden = FALSE)

  ShowOutput <- reactiveVal(FALSE)
  output$show_output <- reactive({
    ShowOutput() 
  })
  outputOptions(output, "show_output", suspendWhenHidden = FALSE)
  
  observeEvent(input$btn_input, {
    ShowInput(FALSE)
    ShowOutput(TRUE)
  })
  
  observeEvent(input$btn_back, {
    ShowInput(TRUE)
    ShowOutput(FALSE)
  })
  
  Value <- eventReactive(input$btn_input, {
    v <- input$caption
    if (v == "xxx") {
      paste(v, "a")
    } else {
      paste(v, "b")
    }
  })
  
  output$value <- renderPrint({
    Value()
  })
}

shinyApp(ui, server)

CodePudding user response:

...
# output$value <- reactive({
output$value <- eventReactive(input$btn_input, {
...
  • Related