【问题标题】:Shiny R: Change border color of selectInputShiny R:更改 selectInput 的边框颜色
【发布时间】:2018-03-29 03:02:46
【问题描述】:

我正在创建一个相当被动的应用程序,其中包含一些 numericInput 变量和一些 selectInput 变量。

由于变量非常多并且用于估计干预措施,因此我引入了颜色来表示与默认值不同的变量。在this 问题中,我已经在@BigDataScientist 的帮助下实现了这一点。呈现 MWE:

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)

如下图所示,我的代码适用于数值,但是它不适用于选择输入变量(至少在交互式环境中)。

现在不是条件不起作用,而是评估并运行runjs。

另外,在下面的js sn-p中可以看到,js命令就可以了。可能有一种方法可以使它成为我想念的反应式(没有与 numericInput 完全相同的提交按钮)。

<!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>

你有什么建议吗?

【问题讨论】:

    标签: javascript r shiny shinyjs shiny-reactivity


    【解决方案1】:

    你不需要selectize.js,所以你可以这样做:

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

    这给出了一个“普通”的选择输入。

    接下来我用color &lt;- "red" 尝试了你的代码,这很有效。

    【讨论】:

    • 所以如果它不可靠并且没有 selectize.js,它可以工作!好的,非常感谢!它也可以是:` if(!is.na(input$V3) & input$V3 != 1){color
    猜你喜欢
    • 2018-01-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-09-16
    • 2021-01-13
    • 1970-01-01
    • 2017-03-05
    • 1970-01-01
    相关资源
    最近更新 更多