Search code examples
rshiny

Automating the slider of SelectInput

The given R Shiny script below creates a box panel with multiple selectInputs, If you click on any selectInput, the slider appears within the box itself, kindly help me to make it appear outside the box and also without modifying the alignment of the box panel and the inputs, in simple terms, "splitlayout" needs a fix. Note: Alignment is very important and please don't alter it.

library(shiny)
library(shinydashboard)
ui <- dashboardPage(
dashboardHeader(),
dashboardSidebar(),
dashboardBody(
box(title = "Data", status = "primary", solidHeader = T, width = 12,
    splitLayout(
      cellArgs = list(style = "padding: 10px"),
      selectInput("select1","select1",c("A1","A2","A3"), selected = "A1"),
      selectInput("select2","select2",c("A3","A4","A5"), selected = "A3"),
       selectInput("select2","select2",c("A3","A4","A5"), selected = "A3"),
         selectInput("select2","select2",c("A3","A4","A5"), selected = 
 "A3"),
         selectInput("select2","select2",c("A3","A4","A5"), selected = "A3")
    ))))
 server <- function(input, output) { }
 shinyApp(ui, server)

BoxPanel Capture

Solution

  • If you don't find a better solution, forcing css (overflow of shiny-split-layout) value should help. 

    library(shiny)
library(shinydashboard)
ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(
    tags$head(tags$style(HTML('.shiny-split-layout>div {overflow:visible}')))
  ),
  dashboardBody(
    box(title = "Data", status = "primary", solidHeader = T, width = 12,
        splitLayout(
          cellArgs = list(style = "padding: 10px"),
          selectInput("select1","select1",c("A1","A2","A3"), selected = "A1"),
          selectInput("select2","select2",c("A3","A4","A5"), selected = "A3"),
          selectInput("select2","select2",c("A3","A4","A5"), selected = "A3"),
          selectInput("select2","select2",c("A3","A4","A5"), selected = 
                        "A3"),
          selectInput("select2","select2",c("A3","A4","A5"), selected = "A3")
        ))))
server <- function(input, output) { }
shinyApp(ui, server)