ShinyWidgets中pickerInput组件整组选项全选/取消全选的适配实现方案（组件内部结构更新后）

嘿，我知道你提到2023年前的老方案因为pickerInput内部结构更新失效了，刚好咱们就用你说的那个示例来改一个适配新版本的可直接用的实现～

先上完整的可运行代码，你替换成自己的选项就能用：

library(shiny)
library(shinyWidgets)

ui <- fluidPage(
  # 带分组的多选pickerInput，注意要开启multiple模式
  pickerInput(
    "test", 
    label = "选择分组选项",
    choices = list(
      "A组" = c("选项a1", "选项a2"),
      "B组" = c("选项b1", "选项b2")
    ),
    multiple = TRUE,
    options = list(
      `actions-box` = TRUE, # 可选：开启顶部的全局全选/反选框
      `selected-text-format` = "count > 2"
    )
  ),
  # 实时显示选中结果，方便测试效果
  verbatimTextOutput("selected"),
  
  # 嵌入适配新版本组件结构的自定义JS
  tags$script(HTML("
    $(document).on('click', '.picker-menu-header', function(e) {
      // 阻止点击分组标题时菜单意外关闭，提升操作体验
      e.stopPropagation();
      // 精准定位当前分组下的所有选项行，不会影响其他分组
      const $groupItems = $(this).nextUntil('.picker-menu-header');
      // 提取选项行内的复选框元素
      const $checkboxes = $groupItems.find('.checkbox input');
      // 根据第一个复选框的状态，决定本次是全选还是取消全选
      const toggleTo = !$checkboxes.first().is(':checked');
      // 切换当前分组所有复选框的选中状态
      $checkboxes.prop('checked', toggleTo).trigger('change');
      // 刷新picker组件，确保Shiny后端能同步捕获到选中值的变化
      $('#test').selectpicker('refresh');
    });
  "))
)

server <- function(input, output, session) {
  output$selected <- renderPrint({
    input$test
  })
}

shinyApp(ui, server)

咱们来唠唠这个方案的核心适配点，专门针对更新后的组件结构：

• 精准命中了新版本pickerInput里分组标题的类名.picker-menu-header，这是和老版本最核心的区别，老版本的类名现在已经不生效啦
• 点击分组标题时先阻止菜单关闭的默认行为，避免操作到一半菜单缩回去的尴尬
• 用nextUntil方法精准圈定当前分组的选项范围，绝对不会误操作其他分组的内容
• 切换完复选框状态后，必须调用selectpicker('refresh')，不然Shiny后端拿不到更新后的选中值，这步可不能偷懒！

要是你自己的pickerInput用了自定义ID，记得把JS里的#test改成你组件对应的ID就行，灵活性拉满～

内容来源于stack exchange