Skip to content

Suggestion: Add a working example of 'Select All' and 'Select None' buttons to the documentation #1153

Open

Description

@warnes

By filing an issue to this repo, I promise that

  • I have fully read the issue guide at https://yihui.org/issue/.
  • I have provided the necessary information about my issue.
    • If I'm asking a question, I have already asked it on Stack Overflow or RStudio Community, waited for at least 24 hours, and included a link to my question there.
    • If I'm filing a bug report, I have included a minimal, self-contained, and reproducible example, and have also included xfun::session_info('DT'). I have upgraded all my packages to their latest versions (e.g., R, RStudio, and R packages), and also tried the development version: remotes::install_github('rstudio/DT').
    • If I have posted the same issue elsewhere, I have also mentioned it in this issue.
  • I have learned the Github Markdown syntax, and formatted my issue correctly.

I needed to add 'Select All' and 'Select None' buttons that work with the select functionality. After quite a bit of searching and experimenting, I found this post on stack overflow showed the necessary approach to creating a button that will trigger a Shiny event: https://stackoverflow.com/a/69351894/21282358.

This is a simple demonstration of the approach for 'Select All' and 'Select None':

library(shiny)
library(DT)

shinyApp(
  ui = fluidPage(
    DTOutput('tbl')
    ),
  
  server = function(input, output) {
    output$tbl = 
      renderDT(
        datatable(
          iris,
          select = 'multiple',
          extensions=c(
            "Buttons"
          ),
          options = list(
            dom = 'Blfrtip',
            buttons = list(
              list(
                extend = 'collection',
                text = 'Select All',
                action = DT::JS(
                  r"(
                  function() {
                      var node = this[0].node;
                      var value = $(node).attr('data-value') || 0;
                      value ++;
                      $(node).attr('data-value', value);
                      Shiny.setInputValue('select_all_btn', value, {priority: 'event'});
                  }
                  )"
                )
              ),
              list(
                extend = 'collection',
                text = 'Select None',
                action = DT::JS(
                  r"(
                function() {
                    var node = this[0].node;
                    var value = $(node).attr('data-value') || 0;
                    value ++;
                    $(node).attr('data-value', value);
                    Shiny.setInputValue('select_none_btn', value, {priority: 'event'});
                }
                )"
                )
              ),
              'copy',
              'csv',
              'excel',
              'print'
            )
          )
        )
      )
    
    
    observeEvent(
      input$select_all_btn,
      {
        DT::dataTableProxy('tbl') |>
          selectRows(selected=1:nrow(iris))
      }
    )
    
    
    observeEvent(
      input$select_none_btn,
      {
        DT::dataTableProxy('tbl') |>
          selectRows(selected=NULL)
      }
    )
  }
)

Perhaps an example like this could be added to the documentation to make if easier for folks to find, at least until integration of the new datatable 'Select' extension is complete.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions