[FIXED] How to insert a hover over pop up window in R Shiny table?

Issue

I found an old post, Add bootstrap tooltip to column header in shiny app, that basically and almost gets at what I need but I'm trying to clean it up. My questions are:

(1) how to remove the annoying pop up what appears when first invoking the below Code, as shown in the next image,

(2) will there be a way to adjust the size of, and otherwise format, the text ("HELLO") that appears when hovering over the table column header, and

(3) are there better options now for doing this sort of thing, where you get an editable, formattable pop-window (with user instructions) when you hover over a specific text string in a table?

Code:

library(shiny)

ui <- fluidPage(fluidRow(column(12,dataTableOutput('table'))))
  
server <- function(input, output) {
  output$table <- renderDataTable(
    iris,
    options = 
      list(
      pageLength = 5,
        initComplete = I("function(settings, json) {alert('Done.');
            $('th').each( function(){this.setAttribute('title','HELLO');});  
            $('th').tooltip();
            }")
      )
    )
    
  tags$head(tags$script("
      $('table th').each(function(){ console.log( $(this).text());
            $(this).attr('data-toggle','tooltip')
            $(this).attr('title','example text')
            $(this).tooltip();
        );
      "))
}

shinyApp(ui,server)

Solution

Once you have an id for the header, you can apply the shinyBS::bsPopover function. To have an id, you can use the container argument of DT::datatable.

library(shiny)
library(DT)
library(shinyBS)

sketch = htmltools::withTags(
  table(
    class = "display",
    thead(
      tr(
        th("Sepal length"),
        th("Sepal width"),
        th("Petal length"),
        th("Petal width"),
        th("Species", id = "header-species")
      )
    )
  )
)

ui <- fluidPage(
  br(),
  DTOutput("dtable"),
  bsPopover(
    id      = "header-species",
    title   = "Species",
    content = "This is the species column"
  )
)

server <- function(input, output, session) {
  output[["dtable"]] <- renderDT({
    datatable(iris, rownames = FALSE, container = sketch)    
  })
}

shinyApp(ui, server)

Answered By - Stéphane Laurent

Answer Checked By - Marie Seifert (PHPFixing Admin)