Shiny selectInput in DT inside module

Question

I'm trying to use Shiny inputs inside a DT::datatable inside a module. Since unfortunately I don't know JavaScript I'm struggling with the callback function in DT::renderDataTable. Using the approach outlined here which follows Yihui's app the callback fails when the datatable is rendered inside the module. After some searching I found that the callback needs to be adjusted for the namespace, but since the default callback here doesn't refer to any inputs by name, I'm not sure where/how to adjust it. See below for a reproducible example:

library(shiny)
library(DT)

module_ui = function(id, label) {

  ns = NS(id)

  tagList(
    DT::dataTableOutput(ns('foo')),
    verbatimTextOutput(ns('sel'))
  )

}

module_server = function(input, output, session){

  ns = session$ns

  data <- head(iris, 5)

  for (i in 1:nrow(data)) {
    data$species_selector[i] <- as.character(selectInput(paste0("sel", i), "", choices = unique(iris$Species), width = "100px"))
  }

  output$foo = DT::renderDataTable(
    data, escape = FALSE, selection = 'none', server = FALSE,
    options = list(dom = 't', paging = FALSE, ordering = FALSE),
    callback = JS("table.rows().every(function(i, tab, row) {
        var $this = $(this.node());
        $this.attr('id', this.data()[0]);
        $this.addClass('shiny-input-container');
      });
      Shiny.unbindAll(table.table().node());
      Shiny.bindAll(table.table().node());")
  )
  output$sel = renderPrint({
    str(sapply(1:nrow(data), function(i) input[[paste0("sel", i)]]))
  })
}

ui <- fluidPage(
  title = 'Selectinput column in a table',
  h3("Source:", tags$a("Yihui Xie", href = "https://yihui.shinyapps.io/DT-radio/")),
  module_ui("tabl")
)

server <- function(input, output, session) {
  callModule(module_server, "tabl")
}

shinyApp(ui, server)

Any help would be much appreciated!

patalt · Accepted Answer · 2020-06-11T13:30:14.763

I've since found an error in my code: when assigning inputs above one needs to wrap the namespace around their IDs as always when assigning inputs in modules: session$ns(paste0("sel", i)). Thought I had done that originally, but apparently not. Anyway, working solution below in case helpful.

library(shiny)
library(DT)

module_ui = function(id, label) {

  ns = NS(id)

  tagList(
    DT::dataTableOutput(ns('foo')),
    verbatimTextOutput(ns('sel'))
  )

}

module_server = function(input, output, session){

  ns = session$ns

  data <- head(iris, 5)

  for (i in 1:nrow(data)) {
    data$species_selector[i] <- as.character(selectInput(ns(paste0("sel", i)), "", choices = unique(iris$Species), width = "100px"))
  }

  output$foo = DT::renderDataTable(
    data, escape = FALSE, selection = 'none', server = FALSE,
    options = list(dom = 't', paging = FALSE, ordering = FALSE),
    callback = JS("table.rows().every(function(i, tab, row) {
        var $this = $(this.node());
        $this.attr('id', this.data()[0]);
        $this.addClass('shiny-input-container');
      });
      Shiny.unbindAll(table.table().node());
      Shiny.bindAll(table.table().node());")
  )

  output$sel = renderPrint({
    str(sapply(1:nrow(data), function(i) input[[paste0("sel", i)]]))
  })
}

ui <- fluidPage(
  title = 'Selectinput column in a table',
  h3("Source:", tags$a("Yihui Xie", href = "https://yihui.shinyapps.io/DT-radio/")),
  module_ui("tabl")
)

server <- function(input, output, session) {
  callModule(module_server, "tabl")
}

shinyApp(ui, server)

Shiny selectInput in DT inside module

1 Answers1