CODEWITHSUNDEEP
rshiny
Duck
Duck

Reputation: 39595

How to add warnings to UI outputs generated dynamically in Shiny

I am working on a shiny app that can generate a determined number of UI outputs in form of inputs based on a value defined by the user. Thanks to the help of @YBS I was able to get the app working. But now I face a new issue. Although I could define min and max value for the inputs generated, I would like to add a warning in the inputs when a value is greater than 100, I found shinyfeedback package can do this but I do not where to put properly the code or what to do in the case of dynamic inputs like the ones generated here.

This is the working app:

library(shiny)
library(shinydashboard)
library(DT)
library(shinyFeedback)
#Function

compute <- function(firstitem,seconditem)
{
  Sum <- firstitem+seconditem
  Difference <- firstitem+seconditem
  Product <- firstitem*seconditem
  Ratio <- firstitem/seconditem
  Res <- data.frame(C1=Sum,C2=Difference,C3=Product,C4=Ratio)
  return(Res)
}

#App

ui = shinyUI(fluidPage(
  
  titlePanel("Compare"),
  
  sidebarLayout(
    sidebarPanel(
      numericInput("numitems", label = "Number of items to compare?",
                   min = 1, max = 100, value = 1),
      uiOutput("period_cutpoints"),
      uiOutput("period_cutpoints2"),
      actionButton("submit", "Submit")
    ),
    mainPanel(
      uiOutput("t1")
    )
  )
))

server = shinyServer(function(input, output, session) {
  
  output$period_cutpoints<-renderUI({
    req(input$numitems)
    lapply(1:(input$numitems), function(i) {
      numericInput(inputId=paste0("firstitem",i), 
                   label=paste0("Enter the value of first item ", i, ":"),value = i)
    })
    
  })
  
  output$period_cutpoints2<-renderUI({
    req(input$numitems)
    lapply(1:(input$numitems), function(i) {
      numericInput(inputId=paste0("seconditem",i), 
                   label=paste0("Enter the value of second item ", i, ":"),value = i+i)
    })
  })
  
  seldates <- reactiveValues(x=NULL)
  observeEvent(input$submit, {
    seldates$x <- list()
    lapply(1:(input$numitems), function(i) { 
      seldates$x[[i]] <- compute(firstitem = input[[paste0("firstitem", i)]],seconditem = input[[paste0("seconditem", i)]])
    })
  })
  
  observeEvent(input$submit, {
    
    lapply(1:(input$numitems), function(i) { 
      output[[paste0("table",i)]] <- renderDT(seldates$x[[i]])
    })
    
    output$t1 <- renderUI({
      tagList(
        lapply(1:(input$numitems), function(i) { 
          DTOutput(paste0("table",i))
        })
      )
    })
    
  })
  
})

shinyApp(ui = ui , server = server)

I tried to add some code inside the dynamic inputs in this way:

#Code demo
  output$period_cutpoints<-renderUI({
    req(input$numitems)
    lapply(1:(input$numitems), function(i) {
      numericInput(inputId=paste0("firstitem",i), 
                   label=paste0("Enter the value of first item ", i, ":"),value = i)
    })
    
    lapply(1:(input$numitems), function(i) {
      observeEvent(input[[paste0('firstitem',i)]], {
        shinyFeedback::feedbackWarning(
          inputId = paste0('firstitem',i),
          show = input[[paste0('firstitem',i)]] > 100,
          text = "Number less than 100 required.",
          color="red"
        )
      })
    })
    
  })

Unfortunately, this action broke down the app:

enter image description here

And the first input was not generated as you can see.

How can I solve this issue so that I can have warnings when the value is greater than 100? Moreover, this leads to an additional fact, in the action button if working with multiple inputs generated dynamically, how could I do something like this:

#How to extend the if condition so that it can consider the number of inputs defined by the user
observeEvent(input$submit,
             {
               if(input$firstitem1 < 0 && input$seconditem1 < 0 && input$firstitem2<0 && input$seconditem1<0)
               {
                 showModal(modalDialog(title ="Warning!!!", "Check fields!!!",easyClose = T))
               }
               else
               {
                 showModal(modalDialog(title ="Congratulations!!!", "Computing Done!!!",easyClose = T))
                 
               }
             })

How could I change the if so that it considers all the inputs that can be generated.

Many thanks!

Upvotes: 0

Views: 316

Answers (1)

Limey
Limey

Reputation: 12461

I think you have a couple of problems here.

First, you have forgotten to add useShinyFeedback() to your UI definition.

ui = shinyUI(
  fluidPage(
    useShinyFeedback(),
    titlePanel("Compare"),
    ...

Second, you've put the observeEvents that monitor your first item values inside your renderUI. That's not going to work: R's standard scoping means that these observeEvents won't be available to monitor changes in the corresponding input widgets. The solution is to create a separate observeEvent to create your observers on the inputs:

  observeEvent(input$numitems, {
    lapply(1:(input$numitems), function(i) {
      observeEvent(input[[paste0('firstitem',i)]], {
        shinyFeedback::feedbackWarning(
          inputId = paste0('firstitem',i),
          show = input[[paste0('firstitem',i)]] > 100,
          text = "Number less than 100 required.",
          color="red"
        )
      })
    })
  })

Making these changes gives me, for example,

enter image description here

With regard to your final question about the Submit actionButton, and as a general observation, I think your life will be much easier if you use Shiny modules to solve this problem. This will allow you to delegate the error checking to the indivudual modules and remove the need to continually loop through the indices of the dynamic inputs. This will lead to shorter, simpler, and more understandable code.

One thing to bear in mind if you do this: make sure you put a call to useShinyFeedback in the definition of the module UI.

Upvotes: 1

Related Questions