rshinyreactable

Reset selected rows in R reactable


I need to deselect all rows in Table 2 when any selected rows in Table 1 change.

Follow these steps with the example code below to see what I mean.

  1. Select all rows in Table 1 (Table 2 is then displayed)
  2. Select "a" in Table 2
  3. Unselect "a" in Table 1.

You will see the tick is just passed to "b" in Table 2 as the selectionId tableid2 remains a value of 1. I have tried a few ideas (commented out below) to programatically change the value of tableid2, with no luck.

library(reactable)
# devtools::install_github("glin/reactable")
# reactable   * 0.1.0.9000 2019-12-13 [1] Github (glin/reactable@566a4ba)
library(shiny)
library(data.table)

my_data <- data.table(col1 = letters[1:5])

ui <- shinyUI(
    fluidPage(
        # shinyjs::useShinyjs(),
        column(4,
            h5('Table 1'),      
        reactableOutput("test_table_react1")
            ),
        column(4,
        h5('Table 2'),      
        reactableOutput("test_table_react2")
            )
        )
)

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

      output$test_table_react1 <- renderReactable({
        reactable(
            data = my_data,
            selection = "multiple",
            selectionId = "tableid1",
            onClick = "select",
            defaultSelected = NULL,
            fullWidth = FALSE
        )
    })

     observeEvent(input$tableid1, {
        # shinyjs::reset(id = 'tableid2')
        # output$test_table_react2 <- renderReactable({NULL})
        # HTML('Shiny.setInputValue("tableid2", NULL);')
        print(input$tableid2)
     }) 

    output$test_table_react2 <- renderReactable({
        req(input$tableid1) 
        reactable(
            data = my_data[input$tableid1, ],
            selection = "multiple",
            selectionId = "tableid2",
            onClick = "select",
            defaultSelected = NULL,
            fullWidth = FALSE
        )
    })

})

shinyApp(ui, server)


Solution

  • You can set up a button to reset the selected rows using reactable::updateReactable. As of this writing, you will need to install the github version of reactable to access updateReactable, using devtools::install_github("glin/reactable").

    actionButton(inputId = "clear_reactable", label="Clear Selection") #put this in UI part
    
    observeEvent(input$clear_reactable, 
        updateReactable("reactable_id", selected = NA)
    )