使用 actionButton() 移动到 DT::datatable 中所选行的下一行

Question

我在下面有一个闪亮的应用程序，我在其中单击数据表行并在其旁边显示其索引。是否可以按Next 按钮并显示下一行的索引？表格的下一行也会相应地突出显示。

library(shiny)
library(DT)


shinyApp(
  ui = fluidPage(
    title = 'Select Table Rows',
    
    h1('A Server-side Table'),
    
    fluidRow(
      column(9, DT::dataTableOutput('x3')),
      column(3, verbatimTextOutput('x4')),
      actionButton("next","Next row")
    )
    
  ),
  server = function(input, output, session) {

    # server-side processing
    mtcars2 = mtcars[, 1:8]
    output$x3 = DT::renderDataTable({datatable(selection = list(target = "row", mode = "single"),mtcars2 )})
    
    # print the selected indices
    output$x4 = renderPrint({
      s = input$x3_rows_selected
      if (length(s)) {
        cat('These rows were selected:\n\n')
        cat(s, sep = ', ')
      }
    })
})

Answer 1

library(shiny)
library(DT)

dat <- iris[1:6,]

callback <- JS(
  "$('#btn-next').prop('disabled', true);",
  "var selected_row = null;",
  "table.on('select', function( e, dt, type, indexes ) {",
  "  $('#btn-next').prop('disabled', false);",
  "  selected_row = indexes[0];",
  "});",
  "table.on('deselect', function( e, dt, type, indexes ) {",
  "  $('#btn-next').prop('disabled', true);",
  "});",
  "var nrows = table.rows().count();",
  "$('#btn-next').on('click', function() {",
  "  var next_row = selected_row + 1 < nrows ? selected_row + 1 : 0;",
  "  table.row(next_row).select();",
  "});"
)

ui <- fluidPage(
  br(),
  DTOutput("dtable"),
  br(),
  splitLayout(
    textOutput("selectedRow"),
    actionButton("btn-next", "select next row"),
    cellWidths = "150px"
  )
)

server <- function(input, output, session) {
  
  output[["dtable"]] <- renderDT({
    datatable(
      dat, 
      extensions = "Select",
      selection = "none",
      callback = callback,
      options = list(
        columnDefs = list(
          list(className = "dt-center", targets = "_all")
        ),
        select = list(style = "single")
      )
    )
  }, server = FALSE)
  
  output[["selectedRow"]] <- renderText({
    i <- input[["dtable_rows_selected"]]
    paste0(
      "Selected row: ", 
      ifelse(is.null(i), "none", i)
    )
  })
  
}


shinyApp(ui, server)