1

I'm currently developing a shiny gadget and have ran into the small issue that Bootstrap popovers don't trigger when generated by renderUI(). Can anyone shed light on why this might be?

I'm not very familiar with js so there could be an obvious answer to this question that I'm missing.

The example below reproduces the issue. In short: a gadget is created that renders a sidebar and a plot; within the side bar are two link tags that should trigger a popover, the first being generated within the UI object, and the second generated by the combination of uiOutput() and renderUI(). For me at least, the reactive popover doesn't trigger.

MWE:

library(shiny)
library(miniUI)

# Functions for popovers --------------------------------------------------

popoverInit <- function() {
  tags$head(
    tags$script(
      "$(document).ready(function(){$('[data-toggle=\"popover\"]').popover();});"
    )
  )
}
popover <- function(content, pos, ...) {
  tagList(
    singleton(popoverInit()),
    tags$a(href = "#pop", `data-toggle` = "popover", `data-placement` = paste("auto", pos),
           `data-original-title` = "", title = "", `data-trigger` = "hover",
           `data-html` = "true", `data-content` = content, ...)
  )
}

# Gadget function ---------------------------------------------------------

reactive_popovers <- function(data, xvar, yvar) {

  ui <- miniPage(
    gadgetTitleBar("Reactive popovers"),
    fillRow(  # Sidebar and plot.
      flex = c(1, 10),
      tagList(
        tags$hr(),

        ## This popover works fine:
        popover("No problems", pos = "right", "Working popover"),

        tags$hr(),

        ## This one doesn't.
        uiOutput("reactive_popover")
      ),

      ## A pointless plot.
      miniContentPanel(
        plotOutput("plot", height = "100%")
      )
    )
  )

  server <- function(input, output, session) {

    ## Render popover.
    output$reactive_popover <- renderUI({
      popover("Popover content", "right", "Dead popover")
    })

    ## Render plot.
    output$plot <- renderPlot({
      plot(mpg ~ hp, data = mtcars)
    })
  }

  runGadget(ui, server, viewer = browserViewer())
}

reactive_popovers()
Jordan Mackie
  • 1,193
  • 10
  • 17

1 Answers1

4

I think this is happening because the popover from renderUI is created after the js binding so it does not get initialised.

Following the answer from this post, you could do:

popoverInit <- function() {
  tags$head(
    tags$script(
      "$(document).ready(function(){
      $('body').popover({
            selector: '[data-toggle=\"popover\"]',
            trigger: 'hover'        
        });});"
    )
  )
}
Community
  • 1
  • 1
NicE
  • 21,165
  • 3
  • 51
  • 68