ebailey78 / shinyBS

Twitter Bootstrap Components for Shiny
182 stars 47 forks source link

bsPopover and tabPanel #111

Open Pauline6010 opened 5 years ago

Pauline6010 commented 5 years ago

Hello, I am currently having trouble using the bsPopover function with the structure of the tabsetPanel/tabPanel. In my app, I would like to make a popover appear when the user hovers over the columns names of a datatable from DT package. It's working fine in a simple tab, but when I use several tabPanel, the popover does not show. Here is my code :

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

shinyApp(
  ui = fluidPage(
    tabsetPanel(
    tabPanel("test", p("test")),
    tabPanel("autre",
    DT::dataTableOutput('foo'),
    bsPopover("column_1", "Test popover", content = paste0("<p>This is a popover</p>"), trigger = 'hover'),
    br()
    )
  )),

  server = function(input, output, session) {
    output$foo <- DT::renderDataTable({
      m = matrix(c(
        '<b>Bold</b>', '<em>Emphasize</em>', '<a href="http://rstudio.com">RStudio</a>',
        '<a href="#" onclick="alert(\'Hello World\');">Hello</a>'
      ), 2)
      colnames(m) = c('<span id = "column_1", style="color:red">Column 1</span>', '<span id = "column_2", style="color:red">Column 2</span>')

      datatable(m, escape = FALSE)
    }, server = TRUE)
  }
)

This code is not working. Here is the exact same code without the tabPanel structure :

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

shinyApp(
  ui = fluidPage(
    #tabsetPanel(
    #tabPanel("test", p("test")),
    #tabPanel("autre",
    DT::dataTableOutput('foo'),
    bsPopover("column_1", "Test popover", content = paste0("<p>This is a popover</p>"), trigger = 'hover'),
    br()
    #))
  ),

  server = function(input, output, session) {
    output$foo <- DT::renderDataTable({
      m = matrix(c(
        '<b>Bold</b>', '<em>Emphasize</em>', '<a href="http://rstudio.com">RStudio</a>',
        '<a href="#" onclick="alert(\'Hello World\');">Hello</a>'
      ), 2)
      colnames(m) = c('<span id = "column_1", style="color:red">Column 1</span>', '<span id = "column_2", style="color:red">Column 2</span>')

      datatable(m, escape = FALSE)
    }, server = TRUE)
  }
)

With this code, the popover shows. Am I doing something wrong ? Thank you very much,

Pauline6010 commented 5 years ago

For the record, I am using shiny 1.3.2, shinyBS 0.61 and DT 0.8

Shyentist commented 3 years ago

I have a similar issue, with bsTooltip only working in the first Tab in a TabPanel.

EDIT: Although it does work if I use tipify as a patch up.