2017-10-17 1 views
1

Ich erstelle eine ziemlich reaktive App, die ein paar numericInput Variablen und einige selectInput Variablen hat.Shiny R: Ändern der Rahmenfarbe von SelectInput

Da die Variablen ziemlich viele sind und sie verwendet werden, um Interventionen zu schätzen, führe ich Farben ein, um diejenigen Variablen zu bezeichnen, die sich vom Standard unterscheiden. Ich habe dies bereits mit Hilfe von @BigDataScientist in this Frage implementiert. Ein MWE präsentiert:

library(shiny) 
library(shinyjs) 
ui<-shinyUI(
    fluidPage(
    useShinyjs(), 
    numericInput("V1", "MyV1" , value = 5, min = 0, max= 100, step = 0.01), 
    numericInput("V2", "MyV2" , value = 23, min = 0, max= 100, step = 0.01), 
    selectInput("V3" , "MyV3" , selected = 1 , choices=c("Yes" = 1,"No" = 0)) 
) 
) 
# 
server<-shinyServer(function(input, output) { 
    observe({ 
    if(!is.na(input$V1) & input$V1 != 5){color <- "solid #9999CC"}else{color <- ""}      
    runjs(paste0("document.getElementById('V1').style.border ='", color ,"'")) 
    if(!is.na(input$V2) & input$V2 != 23){color <- "solid #9999CC"}else{color <- ""}      
    runjs(paste0("document.getElementById('V2').style.border ='", color ,"'")) 
    if(!is.na(input$V3) & input$V3 != 1){color <- "solid #9999CC"}else{color <- ""}      
    runjs(paste0("document.getElementById('V3').style.borderColor ='", color ,"'")) 
    }) 
    }) 
# 
shinyApp(ui,server) 

Wie Sie in der folgenden Abbildung sehen können, mein Code für die numerischen Werte arbeitet, jedoch es nicht für die ausgewählte Eingangsgröße (auf einer interaktive Umgebung zumindest).

My example

Nun ist es nicht, dass die Bedingung nicht funktioniert, wird es ausgewertet und die runjs läuft.

Zusätzlich, wie Sie in der folgenden js Ausschnitt sehen können, ist der js Befehl in Ordnung. Es gibt wahrscheinlich die Möglichkeit, es reaktiv zu machen (ohne Submit-Taste genau wie die numerische Eingabe), die ich vermisse.

<!DOCTYPE html> 
 
<html> 
 
<body> 
 

 

 

 
<select id="mySelect"> 
 
    <option>Apple</option> 
 
    <option>Orange</option> 
 
    <option>Pineapple</option> 
 
    <option>Banana</option> 
 
</select> 
 

 
<p>Click the button to change the style of the H1 element.</p> 
 

 
<button onclick="myFunction()">Try it</button> 
 

 
<script> 
 
function myFunction() { 
 
    document.getElementById("mySelect").style.borderColor = "red"; 
 
} 
 
</script> 
 

 
</body> 
 
</html>

Haben Sie irgendwelche Vorschläge?

Antwort

1

Sie brauchen nicht selectize.js so können Sie tun:

selectInput("V3" , "MyV3" , selected = 1 , choices=c("Yes" = 1,"No" = 0), 
      selectize = FALSE) 

Dies ergibt eine "normale" Eingang wählen.

Als nächstes habe ich Ihren Code mit color <- "red" versucht und das funktioniert.

+0

Also wenn es nicht solide ist und ohne die selectize.js, funktioniert es! Ok, vielen Dank! kann es auch sein: 'if (! Is.na (Eingabe $ V3) & Eingabe $ V3! = 1) {Farbe <-" Solid # 9999CC "} else {Farbe <-" "} runjs (paste0 ("document.getElementById ('V3'). style.border = '", color, "'")) ' –

Verwandte Themen