rstudio / shinydashboard

Shiny Dashboarding framework
https://rstudio.github.io/shinydashboard/
Other
886 stars 300 forks source link

Impossible to use top filter inputs of datable for "out of screen" columns in dashboardPage #328

Open kevinrue opened 4 years ago

kevinrue commented 4 years ago

System details

Browser Version: Safari Version 12.1.1 (14607.2.6.1.1)

Output of sessionInfo():

sessionInfo()
#> R version 3.6.0 (2019-04-26)
#> Platform: x86_64-apple-darwin18.5.0 (64-bit)
#> Running under: macOS Mojave 10.14.5
#> 
#> Matrix products: default
#> BLAS:   /Library/Frameworks/R.framework/Versions/3.6/Resources/lib/libRblas.0.dylib
#> LAPACK: /Library/Frameworks/R.framework/Versions/3.6/Resources/lib/libRlapack.dylib
#> 
#> locale:
#> [1] en_GB.UTF-8/en_GB.UTF-8/en_GB.UTF-8/C/en_GB.UTF-8/en_GB.UTF-8
#> 
#> attached base packages:
#> [1] stats     graphics  grDevices utils     datasets  methods   base     
#> 
#> loaded via a namespace (and not attached):
#>  [1] compiler_3.6.0  magrittr_1.5    tools_3.6.0     htmltools_0.3.6
#>  [5] yaml_2.2.0      Rcpp_1.0.2      stringi_1.4.3   rmarkdown_1.14 
#>  [9] highr_0.8       knitr_1.23      stringr_1.4.0   xfun_0.8       
#> [13] digest_0.6.20   evaluate_0.14

Example application or steps to reproduce the problem

```R # let's make a wide table nrow <- 2 ncol <- length(LETTERS) wide_table <- as.data.frame(matrix( data = rbinom(2*length(LETTERS), 10, 0.2), nrow = nrow, dimnames = list(seq_len(nrow), LETTERS))) ``` ```R # dashboardPage is buggy if (interactive()) { library(shinydashboard) library(shiny) library(DT) shinyApp( ui = dashboardPage( header = dashboardHeader(), sidebar = dashboardSidebar(), body = dashboardBody( fluidRow(column(12, dataTableOutput('tbl'))) ) ), server = function(input, output) { output$tbl = renderDataTable( wide_table, filter="top", rownames=TRUE, options=list(scrollX=TRUE)) } ) } ``` ```R # regular fluidPage works well if (interactive()) { library(shinydashboard) library(shiny) library(DT) shinyApp( ui = fluidPage(fluidRow(column(12, dataTableOutput('tbl')))), server = function(input, output) { output$tbl = renderDataTable( wide_table, filter="top", rownames=TRUE, options=list(scrollX=TRUE)) } ) } ``` ### Describe the problem in detail Considering: - using a `dashboardPage` (as demonstrated above, this issue does not affect `fluidPage`) - a datable with `options=list(scrollX=TRUE)` and `filter="top"` - scroll to the right, to a column initially out of screen - click on the filter input for the column The issue is that upon the last action above, the view of the table header (i.e, column names and top filter inputs) jumps back to the first columns, making it essentially impossible to use the filter input for that column (or any other of those "out of screen" columns). Note that at that moment, the table body (i.e. the cells) stays in the "scrolled right" view, as they were when the filter input was clicked. During that time, the view of the table header is basically desynchronised from the table body. Clicking again on a top filter input makes the table header jump back to the "scrolled right" position, resynchronising them with the table body. Any feedback or bugfix is welcome! Thanks!