在 Shiny 中,避免 selectInput 下拉菜单与其下方的操作按钮重叠
Posted
技术标签:
【中文标题】在 Shiny 中,避免 selectInput 下拉菜单与其下方的操作按钮重叠【英文标题】:In Shiny, avoid overlap of selectInput dropdown with action button underneath it 【发布时间】:2019-07-22 20:09:21 【问题描述】:这似乎是一个很简单的问题,但我已经搜索和搜索了!
我正在使用 selectize 从 selectInput 下拉菜单中的列表中选择多个项目。在它下面我有一个提交按钮来对列表执行一些操作。当您添加多个条目时,选择输入框会变大,并且按钮会动态地向下移动侧边栏,但是当您打开下拉菜单以查看选项列表时,提交按钮是隐藏的。我希望按钮在您打开下拉列表时动态跳下并保持可见,反之在关闭时跳回。
我不能为我的生活......
我知道如何使用 css 更改下拉菜单的默认大小 .selectize-dropdown-content max-height: ... , 我可以添加一个间隔来保持提交按钮始终可见,但是一旦你完成选择项目,这就是浪费空间。
附上示例代码
library(shiny)
library(shinydashboard)
# long entries that will increase number of lines in the selectInput box
nonsenseWords <- c(replicate(25,paste0(sample(letters, 10, replace=TRUE),collapse="")))
ui <-
dashboardPage(
dashboardHeader(),
dashboardSidebar(
fluidRow(style = "margin: 1%",
selectInput("tall_list",
"Stop covering my buttons!",
nonsenseWords,
multiple = TRUE,
selected=nonsenseWords[c(1,5,7,11,20)]
)
# The line below puts static space between the dropdown and the submit button -- this is what I want to remove
# ,tags$div(style = "height: 16em;")
)
,fluidRow(style = "margin: 1%",
actionButton("submit", "Submit")
)
),
dashboardBody(
dataTableOutput("choice")
)
)
server <- function(input, output, session)
output$choice <- renderDataTable(
req(input$submit)
return(data.frame("Chosen Words" = c(input$tall_list)))
)
shinyApp(ui, server)
【问题讨论】:
【参考方案1】:使用这个 CSS:
dashboardBody(
tags$head(
tags$style(".selectize-dropdown position: static")
),
dataTableOutput("choice")
)
【讨论】:
以上是关于在 Shiny 中,避免 selectInput 下拉菜单与其下方的操作按钮重叠的主要内容,如果未能解决你的问题,请参考以下文章
SelectInput 选项不会根据在 Shiny 中选择的 csv 文件动态填充
R Shiny - 如何在 selectInput 中显示选择标签
在 Rmarkdown 中使用 Shiny 创建响应式 selectInput - flexdashboard