4 votes

Application Shiny dont l'interface utilisateur est entièrement construite en HTML - Les éléments d'affichage et de masquage de ShinyJS ne fonctionnent pas.

J'ai une application brillante avec une interface utilisateur entièrement écrite en HTML et j'ai besoin que l'élément HTML avec un id spécifique soit caché/affiché, selon que les données répondent à des conditions spécifiques.

Voici une version simplifiée de ce que j'ai déjà, j'ai utilisé ShinyJS, mais les fonctions show() et hide() ne font rien dans mon application. Que dois-je faire pour que cela fonctionne ? Si ce n'est pas possible avec ShinyJS, quelle est l'autre façon d'afficher/cacher des éléments html dans une application Shiny ? Merci d'avance.

app.R

server <- function(input, output) {

  library(shinyjs)
  useShinyjs(html = TRUE)

  data <- reactive({
    return("abcde")
  })

  observe({
    if ( data() == "abcde"  ) {
      hide("visibility-area")
    } else {
      show("visibility-area")
    }
  })

  output$some-output <- renderPrint({
    cat(data())
  })

}

shinyApp(ui = htmlTemplate("www/index.html"), server)

www/index.html

<!DOCTYPE html>
<html>
<head>
  <script src="shinyjs/inject.js"></script>
  <script src="shared/jquery.js" type="text/javascript"></script>
  <script src="shared/shiny.js" type="text/javascript"></script>
  <link rel="stylesheet" type="text/css" href="shared/shiny.css"/>
  <title>test</title>
</head>
<body>
    <div id="visibility-area">
      <p><span id="some-output" class="shiny-text-output"></span></p>
    </div>
</body>
</html>

global.R

shiny::addResourcePath("shinyjs", system.file("srcjs", package = "shinyjs"))

2voto

MrFlick Points 34459

Lorsque j'exécute l'exemple fourni, je vois le message d'erreur suivant dans la console javascript :

Uncaught ReferenceError: Shiny is not defined

qui provient de la shinyjs/inject.js scropt. Le problème est que script essaye d'appeler une méthode sur les Shiny mais cet objet n'existe pas encore. Vous avez chargé ce fichier avant de charger l'objet shared/shiny.js qui définit cet objet. En changeant l'ordre des includes dans notre <head> semble faire l'affaire. (Je l'ai juste déplacé en dernier)

<head>
  <script src="shared/jquery.js" type="text/javascript"></script>
  <script src="shared/shiny.js" type="text/javascript"></script>
  <link rel="stylesheet" type="text/css" href="shared/shiny.css"/>
  <script src="shinyjs/inject.js"></script>
  <title>test</title>
</head>

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X