Using Fomantic UI JavaScript elements [Advanced]

The hardware and bandwidth for this mirror is donated by METANET, the Webhosting and Full Service-Cloud Provider.
If you wish to report a bug, or if you are interested in having us mirror your free-software or open-source project, please feel free to contact us at mirror[@]metanet.ch.

Appsilon

2024-04-05

Using Fomantic UI JavaScript elements [Advanced]

Some Fomantic UI elements require to run a specific JS code when DOM document is ready. There are at least 2 options to do this:

Use shinyjs

library(shinyjs)
...
jsCode <- " # Fomantic UI componts JS "
...
ui <- function() {
  shinyUI(
    semanticPage(
      title = "Your page title",
      shinyjs::useShinyjs(),
      # Your UI code
    )
  )
}
server <- shinyServer(function(input, output) {
  runjs(jsCode)
  # Your Shiny logic
})
shinyApp(ui = ui(), server = server)

Use shiny::tags$script()

...
jsCode <- "
$(document).ready(function() {
  # Semantic UI components JS code, like:
  #$('.rating').rating('setting', 'clearable', true);
  #$('.disabled .rating').rating('disable');
})
...
"

ui <- function() {
  shinyUI(
    semanticPage(
      title = "My page",
      tags$script(jsCode),
      # Your UI code
    )
  )
}
...
server <- shinyServer(function(input, output) {
  # Your Shiny logic
})

shinyApp(ui = ui(), server = server)

These binaries (installable software) and packages are in development.
They may not be fully stable and should be used with caution. We make no claims about them.