RinteRface / shinydashboardPlus

extensions for shinydashboard
https://shinydashboardplus.rinterface.com
Other
456 stars 77 forks source link

Inputs in controlbar display problems #109

Closed cofrca closed 3 years ago

cofrca commented 3 years ago

I'm trying to render my controlbar contents server-side using renderUI() and then display them using dashboardControlbar( uiOutput() )

For the most part, this is working properly, but it has led to an odd behavior that I'm not sure I understand. image

The next tabs do not feature the same issue image

I'm not sure if this is an avoidable or fixable problem - I can always design things a bit different to avoid this emergent behavior but I figured I'd ask. Thank you!

Here is a copy of my code:

`library(shiny) library(shinyWidgets) library(shinydashboard) library(shinydashboardPlus)

server <- function(input, output,session) { output$controls <- renderUI({ controlbarMenu( id = "menu", controlbarItem( "input1", fluidRow( column(12, align="center", switchInput(inputId = "input1", onStatus = "success", offStatus = "danger", labelWidth = "auto", onLabel = "Affirmative", offLabel = "Negative", value = TRUE), h5("This displays incorrectly")) )), controlbarItem( "input2", fluidRow( column(12, align="center", switchInput(inputId = "input2", onStatus = "success", offStatus = "danger", labelWidth = "auto", onLabel = "Affirmative", offLabel = "Negative", value = TRUE), h5("This displays correctly")) )), controlbarItem( "Tab 3", "Welcome to tab 3", h5("This is a tab") ))}) # render sidebar menu }

ui <- dashboardPage( skin = "midnight", header = dashboardHeader( title = img(src = "https://image.flaticon.com/icons/svg/204/204074.svg")), sidebar = dashboardSidebar(disable = T), body = dashboardBody("The problem occurs in the first tab of right-side controlbar."), controlbar = dashboardControlbar(id = "controlbar", width = 400, uiOutput("controls")))

shinyApp(ui, server)`

DivadNojnarg commented 3 years ago

Hi,

The renderUI is messing with the tabPanel content (adding an extra div to the menu), suppressing margins. What are the reasons making you generate the UI from the server? Depending on the situation, this could be avoided with updateSwitchInput, insertTab, removeTab, ...

cofrca commented 3 years ago

Hi,

The extra div was slipping by unnoticed - thank you for catch! I wanted to have different tabs displayed for different users, and insertTab works wonderfully. I really appreciate the response - I hadn't even thought about those options and now they seem so obvious. Again, thank you for the help :)

Here is my sample code using prependTab and appendTab :

server <- function(input, output,session) { observeEvent(input$bttn,{ if(input$bttn == 1){ prependTab("menu", controlbarItem("input1",fluidRow( column(12, align="center", switchInput(inputId = "input1", onStatus = "success", offStatus = "danger", labelWidth = "auto", onLabel = "Affirmative", offLabel = "Negative", value = TRUE), h5("This displays correctly!")))))} if(input$bttn == 2){ appendTab("menu", controlbarItem("Tab 3", "Welcome to tab 3", h5("This is still a tab")))} }) } ui <- dashboardPage( skin = "midnight", header = dashboardHeader( title = img(src = "https://image.flaticon.com/icons/svg/204/204074.svg")), sidebar = dashboardSidebar(disable = T), body = dashboardBody("The problem is fixed using",code("insertTab()"),h4("Thank you for your help"), hr(),h5("Example trigger:"),actionBttn("bttn","bttn",size = "sm")), controlbar = dashboardControlbar(id = "controlbar", width = 400, controlbarMenu( id = "menu", controlbarItem( "input2", fluidRow( column(12, align="center", switchInput(inputId = "input2", onStatus = "success", offStatus = "danger", labelWidth = "auto", onLabel = "Affirmative", offLabel = "Negative", value = TRUE), h5("This displays correctly")))) ))) shinyApp(ui, server)