shiny conditionalPanel not resizing widget height

[jrowen]

In the example below, the table does not appear when the checkbox is clicked. On the other hand, if the checkboxInput default value is set to TRUE, the table widget appears.

I think the problem is related to the resize when a conditionalPanel is involved. Using the code below, the rhandsontable.js resize function shows that the widget height is being set to 0 when the checkbox is checked.

library(shiny)
library(rhandsontable)

server <- function(input, output) {
  output$tbl <- renderRHandsontable({
    rhandsontable(data.frame(col1 = LETTERS[1:10], col2 = 1:10))
  })
}

ui <- shinyUI(fluidPage(
  sidebarLayout(
    sidebarPanel(
      checkboxInput("check", "Show Table", FALSE),
      conditionalPanel("input.check === true",
                       rHandsontableOutput("tbl"))
    ),
    mainPanel()
  )
))

shinyApp(ui = ui, server = server)

[jjallaire]

@jcheng5 Is there something straightforward we can do in Shiny to make this work?

[ramnathv]

Setting an explicit height in rHandsontableOutput works. The trouble is that when the checkbox is FALSE by default, the conditional panel is hidden and so when the table is generated, it derives its height from the parent element, which turns out to be zero. Easiest way to see this is to set the default to TRUE and now everything works even without the height argument.

So, simple fix as indicated before is to do

rHandsontableOutput("tbl", height = 300)

[jrowen]

Thanks for the suggestion--I stumbled upon a similar fix.

I have the default height in rHandsontableOutput set as 100%. If I change the default to a fixed value, then the table sizing doesn't work as well when used as an input (requires more size adjustments by the user to avoid blank space and scroll bars), so I'd prefer to not change the default. I can add a note to the widget docs if the ultimate fix is to manually specify a height when using a conditionalPanel.

Thanks for the assistance. Sizing this widget has always been a challenge (e.g. #102).

[jcheng5]

Would the height make any sense as "auto"?

[jrowen]

The table also doesn't display when height = "auto".

[KrysD]

Is there any solution to find in the dataTableOutput code ?
I have used the package DataTable to show data when conditional panel where used, and the table resize itself correctly.

library(shiny)
library(DataTable)

server <- function(input, output) {
output$tbl <- renderDataTable({
data.frame(col1 = LETTERS[1:10], col2 = 1:10)
})
}

ui <- shinyUI(fluidPage(
sidebarLayout(
sidebarPanel(
checkboxInput("check", "Show Table", FALSE),
conditionalPanel("input.check === true",
dataTableOutput("tbl"))
),
mainPanel()
)
))

shinyApp(ui = ui, server = server)

[jrowen]

I think I'm getting closer to the issue here. If I run the simple example below and then immediately put a breakpoint on the instance.hot.updateSettings call in the rhandsontable.js resize function, I'm finding that the breakpoint is only hit the first time the widget is resized. If I remove the instance.hot.updateSettings call, the breakpoint it hit each time the widget is resized. Therefore, I'm thinking that updating the handsontable is causing shiny/htmlwidgets to lose its 'link' to the widget.

library(rhandsontable)
library(shiny)

server <- function(input, output) {
  output$mytable <- renderRHandsontable({
    rhandsontable(mtcars)
  })
}

ui <- fluidPage(
  fluidRow(rHandsontableOutput("mytable"))
)

shinyApp(ui = ui, server = server)

[jrowen]

In the case of rhandsontable, it appears that the widget resize function is only called when a relative size was specified (e.g. width: '100%'; height: '100%'). When a widget resize event occurred, I was updating the table using the width and height variables (specified in px), which is why the method was only called for the first resize event.

Is this the expected behavior or should the resize event be occurring each time the browser window size changes? Any guidance would be greatly appreciated.

[moritz4]

Is there any fix for the issue? Setting a specific height does not work for me rHandsontableOutput("tbl", height = 300).
I have a bunch of conditional panels with rhandsontables in them which do not appear. If I click anywhere in the app, the table suddenly appears.

[JohnCoene]

This is specific to {rhandsontable} because it does not implement the resize method, this PR jrowen/rhandsontable#374 fixes this (not merged).