在 R-Shiny 模块中更改 DT 分页中的 pageType

Question

Currently, I am designing an R-Shiny module that produces a DT table that includes paging. By default, DT default paging type is "simple_numbers" . My goal is to change the default paging type to "simple" (see DataTable pagingType Documentation ).

While I have not found anything specific to R-Shiny, there have been some SO posts that I found related to my task ( this one being the most helpful ), but, unfortunately, I really have made no progress.

My current attempts have been:

1. I have tried inserting into the UI:

    shiny::tags$script(
      shiny::HTML(paste0('
      $(document).ready(function() {
        $("#', ns(name), '").dataTable({
          "pagingType": "simple",
          "sPaginationType": "simple"
        });
      });')))

But received the following error:

jquery.min.js:2 jQuery.Deferred exception: $(...).dataTable is not a function TypeError: $(...).dataTable is not a function

2. I have included this in the DT::datatable() object callback option:

 callback = DT::JS(paste0('
        // * Examine the table 
        tableObject = table.settings()[0];
        console.log(table.settings());

        // * Pagination Type 
        tableObject.sPaginationType = "simple";

      '))

However, while nothing errors in the inspector console, the pagination type does not change.

So, at this point, I am a bit perplexed and wondering if someone could help me bridge the gap between the documentation and SO post and my current logic.

To help answer this question, I have created a very basic reproducible example of each of my attempts below with pre-loaded data from R.

Attempt 1:

table_ui = function(id, name = "table") {

  # * Create a namespace function using the provided id
  ns = shiny::NS(id)

  # * Build HTML shiny taglist for table view
  shiny::tagList(
    shiny::tags$script(
      shiny::HTML(paste0('
      $(document).ready(function() {
        $("#', ns(name), '").dataTable({
          "pagingType": "simple",
          "sPaginationType": "simple"
        });
      });'))),
    DT::dataTableOutput(outputId = ns(name))
  )

}

table_server = function(input, output, session, name = "table") {

  # * Extract Data ----
  data_df = shiny::reactive({ datasets::mtcars })

  # * Produce HTML Table ----
  # * NOTE: Transform "data_df()" into HTML table
  output[[name]] = DT::renderDataTable({

    # * Build HTML table 
    DT::datatable(
      data_df(), 
      rownames = FALSE, 
      options = list(
        paging = TRUE,
        pageLength = 5,
        dom = "<f<t>ip>"
      )
    )

  })

  # * Return
  return(data_df)

}

# * Create simple app

# * Define UI
ui = shiny::fluidPage(
  table_ui(id = "test", name = "report"),
)

# * Define Server
server = function(input, output, session) {

  # * Extract text input
  shiny::callModule(
    module = table_server, 
    id = "test", 
    session = session,
    name = "report")

}

# * Build App
shiny::shinyApp(ui = ui, server = server)

Attempt 2:

table_ui = function(id, name = "table") {

  # * Create a namespace function using the provided id
  ns = shiny::NS(id)

  # * Build HTML shiny taglist for table view
  shiny::tagList(
    DT::dataTableOutput(outputId = ns(name))
  )

}

table_server = function(input, output, session, name = "table") {

  # * Extract Data ----
  data_df = shiny::reactive({ datasets::mtcars })

  # * Produce HTML Table ----
  # * NOTE: Transform "data_df()" into HTML table
  output[[name]] = DT::renderDataTable({

    # * Build HTML table 
    DT::datatable(
      data_df(), 
      rownames = FALSE, 
      options = list(
        paging = TRUE,
        pageLength = 5,
        dom = "<f<t>ip>"
      ),
      # ** JS Support ----
      # * NOTE: Define JS to modify table
      callback = DT::JS(paste0('
        // * Examine the table 
        tableObject = table.settings()[0];
        console.log(table.settings());

        // * Pagination Type 
        tableObject.sPaginationType = "simple";

      '))
    )

  })

  # * Return
  return(data_df)

}

# * Create simple app

# * Define UI
ui = shiny::fluidPage(
  table_ui(id = "test", name = "report"),
)

# * Define Server
server = function(input, output, session) {

  # * Extract text input
  shiny::callModule(
    module = table_server, 
    id = "test", 
    session = session,
    name = "report")

}

# * Build App
shiny::shinyApp(ui = ui, server = server)

Answer 1

You don't need to resort to JavaScript. Just add pagingType = "simple" in the list of options.