R光沢：私はボタンはこのような光沢のあるダッシュボードのボックスの中に含めている私の光沢のあるアプリケーションで箱持ってactionButton

Question

にWebリンクを追加：

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

を私は、そのようなそのボタンにWebリンクを含めますそれをクリックすると、対応するWebページが新しいタブで開きます。私は、私が代わりにこれを行うことができることを知って

：

# 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では、素敵なボタンがあり、私は審美的に良く見えるそれにアイコンを追加することができます。私はピカピカにactionButtonへのリンクを追加するにはどうすればよい

？

Answer 1

あなたは、アクションボタンにパラメータ

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

を追加し、それが現在のウィンドウでgoogle.comに行くことができますクリックするか、

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

を追加することができ、あなたが取られることができ

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')") 
) 
) 

で新しいタブ

でGoogleに

Answer 2

onclickの方法はシンプルですが、JavaScriptに依存しています。さらに重要なことは、リンクを動的に生成したいと思うなら、それは厄介なことです。私は、ユーザーの入力に応じて特定のページを開くアプリケーション内のリンクを持っていたいと思うし、ボタンとしてリンクを作成することができます。

最初に、uiOutputとrenderUIというダイナミックな部分については、サーバー部分でしかリンクを生成できないため、この部分について説明します。シンプルなリンクは

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

になりますただ、私たちはアクションボタンがどのように見えるかを見ることができるボタンを作成するには

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

を取得Rにこの行を実行します。

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

はその後、我々は

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

を取得するには、この

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

を行うことができます今、私たちは、ボタンのように見えるのリンクを持っていて、さらにいずれかの形式のパラメータでそのスタイルをカスタマイズすることができますまたはカスタマイズされたCSS。 chrome/firefoxデベロッパーツールを使用してアプリを開き、CSSを目的の効果に変更してから、変更したCSSをwwwフォルダのstyle.cssに追加して、デフォルトのスタイルを上書きします。

多くのhtmlタグの出力を見ると、実際に多くのものを組み合わせて組み立てて、多くのカスタマイズを得ることができます。