R shiny:如何为通过HTML创建的actionButton提供inputID

Question

如果我创建一个.htlm文件来定义一个actionButton,我如何为该按钮提供一个inputID(为了根据其值做其他事情)？

正如您将在.html中看到的那样,我尝试给它一个"id",但它不起作用.我相信实际给出一个inputID应该在ui.R文件中完成.

这是我的UI,服务器和.htlm文件:

1/UI:

library(shiny)
shinyUI(pageWithSidebar(
headerPanel("test"),

sidebarPanel(),

mainPanel(
includeHTML("static.html"),
uiOutput("x")
)
))

2 /服务器:

shinyServer(function(input,output){
output$x<-renderUI(h4(input$button1))            
})

3/static.html

<p> <button class="btn btn-large btn-primary" type="button" id="button1"><i class="icon-star"></i>Large button</button>

</p> 

任何建议都将受到高度赞赏.

干杯

Answer 1

我认为问题是你的html正在创建一个普通的"按钮",而不是一个闪亮的"动作按钮".如果您的目标是创建包含自定义类的操作按钮,则可以执行以下操作:

tags$button(id="button1", 
            type="button", 
            class="btn action-button btn-large btn-primary", 
            HTML('<i class="icon-star"></i>Large button'))

这相当于对调用,actionButton(...)但允许您class=...显式设置属性.

因此,此代码会生成一个页面,其中的操作按钮与static.html文件中的样式相同.

library(shiny)
shinyUI = pageWithSidebar(
  headerPanel("test"),
  sidebarPanel(HTML(paste('<p>Click Count: ',textOutput("count"),'</p>'))),
  mainPanel(
#    includeHTML("static.html"),
#    uiOutput("x"),
    tags$button(id="button1", 
                type="button", 
                class="btn action-button btn-large btn-primary", 
                HTML('<i class="icon-star"></i>Large button'))
  )
)
shinyServer = function(input,output){
 # output$x     <- renderUI(input$button1)
 output$count <- renderText(input$button1)
}

runApp(list(
  ui = shinyUI,
  server = shinyServer
))

如您所见,您可以在shinyServer使用中引用它input$button1.我还建议你加载最新版本的软件包shiny.

编辑(回复@JulienNavarre评论)

事实证明这也是有效的:

library(shiny)
shinyUI = pageWithSidebar(
  headerPanel("test"),
  sidebarPanel(HTML(paste('<p>Click Count: ',textOutput("count"),'</p>'))),
  mainPanel(
        includeHTML("static.html")
  )
)
shinyServer = function(input,output){
  output$count <- renderText(input$button1)
}

runApp(list(
  ui = shinyUI,
  server = shinyServer
))

如果您更改static.html如下:

<button class="btn action-button btn-large btn-primary" type="button" id="button1">
   <i class="icon-star"></i>
      Large button
</button>

换句话说,您必须包含action-button在类列表中,并删除<p></p>标记.