mathjax/latex does not work when using renderUI()

Question

I was able to use LaTeX in my Shiny app as follows:

  tags$head(
    tags$script(
      type = "text/javascript",
      src = "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS-MML_HTMLorMML"
    )
  )

and in some loop in UI.R, I have written:

radioButtons(paste0("answr", t), "", choices = df_solutions[[t]][["answers"]]),
 

The df_solutions[[t]][["answers"]] contains typically things like: Solution 1 is: \\( e^x \\).

The previous code was included in the UI.R file. So far so good, this works!

However, for some other reasons, I also need to generate this list (among other things) in server.R.

I am using a renderUI() element and tried to include the same radioButtons code as above inside this function. The output$questionList <- renderUI() is then passed to UI.r via uiOutput("questionList") but the LaTeX code no longer is rendered (only plain text).

I tried to include the tags$script() inside the renderUI() but that does not solve the problem.

---

UPDATE: I have added the following minimal reproducible example:

library(shiny)

ui <- fluidPage(
  
  tags$head(
    tags$script(
      type = "text/javascript",
      src = "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS-MML_HTMLorMML"
    )
  ),
  
  HTML("Next line is output originating from UI.R side  (Mathjax is displayed) <br>"),
  radioButtons("answer", "", choices = c(" \\( e^x \\) ", " \\( \\sum x_i \\) ")),
  
  br(),
  br(),
  HTML("<hr>"),
  HTML("<hr>"),
  HTML("Loop/output originating from server.R is going to start now: (no Mathjax display)"),
  br(),
  br(),
  uiOutput("questionsList")
)




# Define server logic 
server <- function(input, output) {
  
  output$questionsList <- renderUI({
    
    # tags$head(
    #   tags$script(
    #     type = "text/javascript",
    #     src = "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS-MML_HTMLorMML"
    #   )
    # )
    
    vector_choice <- c(" \\( e^x \\) ", " \\( \\sum x_i \\) ")
    
    
    # I need this loop for other purposes in my real code
    lapply(1:3, function(i) {
      html_text <- HTML(paste("<b>First text of Loop ", i, ":</b>", "$e^x$ $$e^y$$ \\( e^x \\)", "<br>"))
      
      
      fluidRow(
        column(width = 8,
               html_text,
               radioButtons(paste0("xanswer", i), "",
                            choices = vector_choice)
        )
      )
    })
  })
}

# Run the application 
shinyApp(ui = ui, server = server)

Answer 1

Wrap your radioButtons in withMathJax(), as per this page. I've include only your loop within the server function. Everything else is unchanged.

    lapply(
      1:3, 
      function(i) {
        html_text <- HTML(paste("<b>First text of Loop ", i, ":</b>", "$e^x$ $$e^y$$ \\( e^x \\)", "<br>"))
        fluidRow(
          column(
            width = 8,
            html_text,
            withMathJax(
              radioButtons(
                paste0("xanswer", i), "",
                choices = vector_choice
              )
            )
          )
        )
      }
    )