Shiny not updating the contents of the sidebarPanel

[calvarez]

Hi everybody. I have a problem with an app that not even chat GPT4 could help me solve. The issue is that for some reason it is not updating the contenst of the sidebarPanel when the user changes the tab. It should display different contents depending on the tab but it is not happening. Can anyone guess what's wrong. I attach a simple example so you can try it out.

library(shiny)

ui <- fluidPage(
  titlePanel("App for testing"),
  hr(),
  
  sidebarLayout( 
    
    sidebarPanel(
      
      conditionalPanel(condition = "input.tabselected == 1",
                       
                       textInput("nombre_entidad", "Indique el nombre de la entidad financiera a evaluar"),
                       dateInput("fecha", "Indique la fecha de los datos de la entidad financiera a evaluar", 
                                 value = "1/1/2020", format = "dd/mm/yyyy", min = "1/1/2010"),
                       numericInput("morosidad", "Morosidad mayor a 90 días:", value = 4),
                       fluidRow(
                         column(6, numericInput("credito", "Cartera de crédito:", value = 6)),
                         column(6, numericInput("activoproductivo", "Activo productivo:", value = 5))
                       ),
                       numericInput("pasivo_cc", "Pasivo con costo:", value = 7),
                       fluidRow(
                         column(6, numericInput("utilidad", "Utilidad acumulada 12 meses:", value = 6)),
                         column(6, numericInput("patrimonio_prom", "Patrimonio promedio 12 meses:", value = 2))
                       ),
                       fluidRow(
                         column(6, numericInput("ingresos_if", "Ingresos por intermediación financiera:", value = 6)),
                         column(6, numericInput("gastos_if", "Gastos por intermediación financiera:", value = 4))
                       ),
                       numericInput("provisiones", "Provisiones por cartera de crédito morosa:", value = 8),
                       fluidRow(
                         column(6, numericInput("ingresos_nofin", "Ingresos no financieros:", value = 9)),
                         column(6, numericInput("gastos_nofin", "Gastos no financieros:", value = 3))
                       ),
                       fluidRow(
                         column(6, numericInput("patrimonio", "Patrimonio:", value = 5)),
                         column(6, numericInput("pasivototal", "Total Pasivos:", value = 4))
                       ),
                       actionButton("calcular", "Calcular")
      ),
      
      conditionalPanel(condition = "input.tabselected == 2",
                       h3("Some text for trial")),
      
      conditionalPanel(condition = "input.tabselected == 3",
                       h5("Some text for trial"))
    ),
    
    mainPanel(
      tabsetPanel(id = "tabselected", type = "pills",
                  
                  tabPanel(title = "Cálculo del Índice de riesgo", value = 1,              
                           textOutput("result")),
                  
                  tabPanel(title = "Análisis cualitativo", value = 2,  
                           textOutput("result")),
                  
                  tabPanel(title = "Resultado final", value = 3,  
                           textOutput("result"))
      )
    )
  )
)



server <- function(input, output) {
  
  sum <- reactive({
    input$credito + input$activoproductivo
  })
  
  output$result <- renderText({
       paste0("The sum is ", sum())
  })
  
  #observeEvent(input$calcular, {
  #  output$result <- renderText({
  #    paste0("The sum is ", sum())
  #  })
  #}) 

}


shinyApp(ui, server)

Thank you very much for your help

[michaelbgarcia]

@calvarez

                  tabPanel(title = "Cálculo del Índice de riesgo", value = 1,              
                           textOutput("result")),
                  
                  tabPanel(title = "Análisis cualitativo", value = 2,  
                           textOutput("result")),
                  
                  tabPanel(title = "Resultado final", value = 3,  
                           textOutput("result"))

Hello, the problem is that you are using the same outputId "result" more than once. Output IDs in Shiny apps share a global namespace so each ID must be unique. If you look at the HTML element that is generated by textOutput("result") (by "Inspect Element" in your browser) you'll see that the div has id="result", which can only happen once. Otherwise, you get undefined and unexpected behavior as you've seen.

To illustrate, if you just comment out two of the threetextOutput("result") like below, you get your expected behavior which means the rest of your code was good.

                  tabPanel(title = "Cálculo del Índice de riesgo", value = 1,              
                           textOutput("result")),
                  
                  tabPanel(title = "Análisis cualitativo", value = 2),  
                           #textOutput("result")),
                  
                  tabPanel(title = "Resultado final", value = 3)
                           #textOutput("result"))

Using modules will solve this, and scales great with your app. However, the simplest solution for a very simple app is to just create output$result_1, output$result_2, etc.. though that will only take you so far!