Adjusting the size of the box Panel in R shiny

Question

Tthe given R shiny script produces a box panel with a number of selectInputs as shown in the snapshot below. The box panel is such that when we hide or present the sidebar, the panel adjusts the size of the boxes and they remain intact.

However, when I remove or add even one extra widget like a selectinput, the widgets do not span the length of the box panel end to end and break out of the panel. How to make it such that when I add an extra widget or remove one, the end to end spanning gets maintained?

## app.R ##
library(shiny)
library(shinydashboard)
ui <- dashboardPage(
dashboardHeader(),
dashboardSidebar(),
dashboardBody(
box(title = "Data", status = "primary", solidHeader = T, width = 12,
    fluidPage(
      fluidRow(
column(2,offset = 0, style='padding:1px;', 
selectInput("select1","select1",c("A1","A2","A3"), selected = "A1")),
        column(2,offset = 0, style='padding:1px;', 
selectInput("select2","select2",c("A3","A4","A5"), selected = "A3")),
        column(2, offset = 0, 
style='padding:1px;',selectInput("select2","select2",c("A3","A4","A5"), 
selected = "A3")),
        column(2, offset = 0, 
style='padding:1px;',selectInput("select2","select2",c("A3","A4","A5"), 
selected = "A3")),
column(2, offset = 0, 
style='padding:1px;',selectInput("select2","select2",c("A3","A4","A5"), 
selected = "A3")),

        column(2, offset = 0, 
style='padding:1px;',selectInput("select2","select2",c("A3","A4","A5"), 
selected = "A3")),
        tags$head(
          tags$style("
                     .input-sm,.selectize-input {
                     min-height: 34px;  font-size: 11.2px;
                     }
                     ")))))))
server <- function(input, output) { }
shinyApp(ui, server)

So, if you remove one widget, you want the other widgets to cover end to end. Is it the question? — amrrs, Jan 19 '18 at 11:13
@amrrs, thanks again, yes if I remove, then that and if I add another widget, then the length adjusts on its own. — Adam Shaw, Jan 19 '18 at 11:14
@MLavoie, thanks a lot for replying, that is the reason why I am asking for a fix, no matter how many widgets we add or remove, the length of the bar should remain fixed end to end. — Adam Shaw, Jan 19 '18 at 12:48

MLavoie · Accepted Answer · 2018-01-19T13:26:17.943

4

With splitLayout you could try this. Just uncomment to have all six sliderInput in your box.

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")
             #     selectInput("select2","select2",c("A3","A4","A5"), selected = "A3")
                  ))))
server <- function(input, output) { }
shinyApp(ui, server)

edited Jan 19 '18 at 13:26

answered Jan 19 '18 at 12:50

MLavoie

9,671
41
36
56

1

great, just one small tweak, if you check from right, the right edge of the last box is overlapping with the table border, please give me a fix and that's all. Thanks. – Adam Shaw Jan 19 '18 at 13:10
adding extra edges makes them move out of the box, kindly check. – Adam Shaw Jan 19 '18 at 13:13
I am definitely going to accept your answer, however your usage of cellWidth assigns a hard coded width to the cells, just hide the sidebar and see what happens, the end to end spanning does not occur, please help me with a fix here. – Adam Shaw Jan 19 '18 at 13:23
see edits again. When I run that code or with all sliderInput, I see no problems... – MLavoie Jan 19 '18 at 13:27
in your solution above, can you help me to make the slider of a particular selectInput appear out of the box like in my question above, currently it appears within the box itself, thanks and please help. – Adam Shaw Jan 23 '18 at 09:11
what do you mean by slider of a particular selectInput. Do you mean you want to add a sliderInput() outside your box called data? – MLavoie Jan 23 '18 at 09:27
thanks for replying, I'll be very clear, in the box panel in the R shiny dashboard, when you click on the selectInput, the items of selectInput appear inside the box, I want this to appear outside the box like in the selectInput in my question above. Kindly help. – Adam Shaw Jan 23 '18 at 09:31
It should be a different question. But here (https://stackoverflow.com/questions/40077388/r-shiny-splitlayout-and-selectinput-issue/40098855#40098855) will fix your problem! – MLavoie Jan 23 '18 at 10:12

Adjusting the size of the box Panel in R shiny

1 Answers1