R shiny:将weblink添加到actionButton

时间:2016-06-13 17:26:15

标签: html r hyperlink action-button

我的闪亮应用程序中有一个框,其中有一个按钮,包含在闪亮的仪表板框中,如下所示:

shiny::fluidRow(
  shinydashboard::box(title = "Intro Page", "Some description...", 
      shiny::actionButton(inputId='ab1', label="Learn More", icon = icon("th"))
  )
)

我想在按钮中加入一个网页链接,这样当我点击它时,它应该在新标签页中打开相应的网页。

我知道我可以这样做:

# this does not create a submit button though, it just creates a link.
tags$div(class = "submit",
         tags$a(href = "www.google.com", 
                "Learn More", 
                target="_blank")
)

但是使用actionButton,有一个很好的按钮,我可以添加一个看起来更美观的图标。

enter image description here

如何在有光泽的情况下添加actionButton的链接?

3 个答案:

答案 0 :(得分:19)

您可以添加参数

onclick ="location.href='http://google.com';"

点击操作按钮并点击它会转到当前窗口中的google.com,或者您可以添加

onclick ="window.open('http://google.com', '_blank')"

您将在新标签页中转到Google

那是

shiny::fluidRow(
  shinydashboard::box(title = "Intro Page", "Some description...", 
      shiny::actionButton(inputId='ab1', label="Learn More", 
                          icon = icon("th"), 
                          onclick ="window.open('http://google.com', '_blank')")
  )
)

答案 1 :(得分:4)

onclick方法很简单,但它依赖于javascript。更重要的是,如果您想动态生成链接,那将会很尴尬。我希望在我的应用程序中有一个链接,根据用户输入打开特定页面,我发现你只需将一个链接打扮成一个按钮。

首先,我使用uiOutputrenderUI来处理动态部分,因为链接只能在服务器部分生成。简单的链接将是

a(h4("Open Link"), target = "_blank", href = paste0("http://www.somesite/", some_link))

只需在R中运行此行即可

<a target="_blank" href="http://www.somesite/somelink">
  <h4>Open Link</h4>
</a>

要创建按钮,我们可以查看操作按钮的外观。

> actionButton("download", "Download Selected",
              icon = icon("cloud-download"))
<button id="download" type="button" class="btn btn-default action-button">
  <i class="fa fa-cloud-download"></i>
  Download Selected
</button>

然后我们可以这样做

shiny::a(h4("Open Link", class = "btn btn-default action-button" , 
    style = "fontweight:600"), target = "_blank",
    href = paste0("http://www.somesite/", some_link))

获取

<a target="_blank" href="http://www.somesite/some_link">
  <h4 class="btn btn-default action-button" style="fontweight:600">Open Link</h4>
</a>

现在我们有一个看起来像按钮的链接,您可以使用样式参数或自定义css进一步自定义其样式。使用chrome / firefox开发人员工具打开您的应用程序,将css修改为您想要的效果,然后将修改后的CSS添加到www文件夹中的style.css以覆盖默认样式。

如果你看一下许多html标签功能的输出,你会发现你实际上可以将许多东西组合在一起并组装起来以获得大量的自定义。

答案 2 :(得分:0)

基于@dracodoc关于动态生成的链接的观点,您可以使用renderUI获得所需的效果。在下面的示例中,input$open_tab引用了一个通用的actionButton。请注意,您仍然需要在用户界面中包含对以下renderUI的引用(即uiOutput(“ ui_open_tab”))

output$ui_open_tab <- renderUI({
  req(input$open_tab > 0)
  link <- function_to_build_the_link(a, b, c)
  tags$script(paste0("window.open('", link, "', '_blank')"))
})