如何构建带不可点击分组标题的Shiny pickerInput组件

我有一个包含8个选项的简单Shiny应用，其中部分选项因属性相似需要归为同一组。我希望给每组添加不可点击的标题——该标题无法被点击，也不会被注册为输入值。

当前pickerInput的效果（左侧）与预期效果（右侧）对比：

我了解shinyTree工具可创建树形结构，但它的标题均为可点击的输入项，不符合需求。以下是我的原始应用代码：

library(shiny)

ui <- fluidPage(
  pickerInput(
    "Grouped options",
    label = "Select one or multiple options",
    choices = list(
      "Option 1" = "Option 1", # group 7, 8 and 9 as 'A'
      "Option 2" = "Option 2",
      "Option 3" = "Option 3",
      "Option 4" = "Option 4", # group 4, 5 and 6 as 'B'
      "Option 5" = "Option 5",
      "Option 6" = "Option 6",
      "Option 7" = "Option 7", # group 7 and 8 as 'C'
      "Option 8" = "Option 8"
    ),
    selected = NULL,
    multiple = TRUE,
    options = list(`actions-box` = TRUE),
    choicesOpt = NULL,
    width = NULL,
    inline = FALSE
  )
)

server <- function(input, output, session) {
}

shinyApp(ui, server)

解决方案 #

可以利用pickerInput的嵌套分组特性，结合choicesOpt参数设置分组标题的不可选状态和样式，实现需求：

library(shiny)
library(shinyWidgets)

ui <- fluidPage(
  pickerInput(
    inputId = "Grouped_options", # 修正inputId，避免空格引发问题
    label = "选择一个或多个选项",
    choices = list(
      "组A" = list("选项1", "选项2", "选项3"),
      "组B" = list("选项4", "选项5", "选项6"),
      "组C" = list("选项7", "选项8")
    ),
    selected = NULL,
    multiple = TRUE,
    options = list(`actions-box` = TRUE),
    choicesOpt = list(
      # 标记分组标题为不可选，选项为可选
      disabled = c(TRUE, rep(FALSE, 3), TRUE, rep(FALSE, 3), TRUE, rep(FALSE, 2)),
      # 为分组标题设置样式，区分于普通选项
      style = c(
        "font-weight: bold; color: #666; background-color: #f5f5f5;",
        rep("", 3),
        "font-weight: bold; color: #666; background-color: #f5f5f5;",
        rep("", 3),
        "font-weight: bold; color: #666; background-color: #f5f5f5;",
        rep("", 2)
      )
    )
  )
)

server <- function(input, output, session) {
  # 可添加观察器验证输入值，确认分组标题不会被选中
  observe({
    print(input$Grouped_options)
  })
}

shinyApp(ui, server)

关键说明： #

• 使用嵌套列表定义分组：外层元素为分组标题，内层为该组的可选选项
• 通过choicesOpt$disabled将分组标题设为TRUE（不可选），选项设为FALSE（可选）
• 用choicesOpt$style给分组标题设置加粗、浅灰文字和背景，让它视觉上更像不可点击的标题
• 修正了原代码中inputId含空格的问题，避免潜在的Shiny输入识别错误
• 确保已安装shinyWidgets包，pickerInput的完整功能依赖该包

内容的提问来源于stack exchange，提问作者Wander Demuynck