2016-04-04 75 views
3

我試圖把我的「家」tabPanel上的鏈接放到我的應用程序的所有其他tabPanel中。[閃亮]:將鏈接添加到另一個tabPanel中的另一個tabPanel

的想法如下:

ui = navbarPage("", 
     tabPanel("home", 
        fluidPage(
        fluidRow(box("this 1st box should lead me to tab1a")), 
        fluidRow(box("this 2nd box should lead me to tab1b")), 
        fluidRow(box("this 2nd box should lead me to tab2"))) 
      ), 
     navbarMenu("tab1", 
        tabPanel("tab1a"), 
        tabPanel("tab1b")), 
     tabPanel("tab2") 
     ) 
shinyApp(ui, server=function(input, output) {}) 

我見過的答案Add link panel tabs in Shiny with various top level navigation bars,但我無法實現它在我的代碼,因爲它涉及的HTML(這是我以前從來沒有工作過,所以我不熟悉函數等),代碼認爲paneltabs具有相同的選項卡(不確定這是爲什麼它不在這裏工作,如果它可能不起作用,因爲我試圖鏈接的選項卡在navbarpage或某事)。

任何人都可以幫助我或告訴我在哪裏我可以學習如何在我的例子中實現這個?

+0

你只需要一個HTML鏈接(閃亮的'a()')。如果你看看標籤上的普通按鈕上的URL,它們看起來像'http://127.0.0.1:4301 /#tab-6088-1'(對於我在tab1a上)。另外,'box'爲我打破了上述情況,因爲該功能用於添加圖表,而不是HTML。 – alistaire

回答

3

這個答案純粹是Java腳本化的,但是我猜很少。由於Shiny使用隨機數字ID創建標籤,並且不允許訪問它使用的ID,所以這樣做的確可以做到客戶端。但是沒有必要將JavaScript用於其他場景的知識。 JavaScript部分僅用於複製/粘貼,觸發器命令易於理解。

我做了什麼?我安裝了一個功能,可以找到與所需選項卡相對應的導航欄鏈接,然後點擊它。該實用程序可以通過「onclick」屬性添加到任何元素。沒有特殊的標籤(例如,不需要「a」標籤)。

下面的代碼可以很容易地定製這個解決方案,以適應您的需求。

注:我使用原始代碼與box,雖然它沒有任何視覺效果。

代碼:

library(shiny) 
library(shinydashboard) 

ui = shinyUI(

    navbarPage("Header", 
    tabPanel("home", 
     tags$head(tags$script(HTML(' 
     var fakeClick = function(tabName) { 
      var dropdownList = document.getElementsByTagName("a"); 
      for (var i = 0; i < dropdownList.length; i++) { 
      var link = dropdownList[i]; 
      if(link.getAttribute("data-value") == tabName) { 
       link.click(); 
      }; 
      } 
     }; 
     '))), 
     fluidPage(
     fluidRow(box("this 1st box should lead me to tab1a", onclick = "fakeClick('tab1a')")), 
     fluidRow(box("this 2nd box should lead me to tab1b", onclick = "fakeClick('tab1b')")), 
     fluidRow(box("this 2nd box should lead me to tab2", onclick = "fakeClick('tab2')")) 
    ) 
    ), 
    navbarMenu("tab1", 
     tabPanel("tab1a", "Some Text inside Tab 1a."), 
     tabPanel("tab1b", "Some Text inside Tab 1b.") 
    ), 

    tabPanel("tab2", "Some Text inside Tab 2.") 
) 
) 

server = function(input, output, session){} 

runApp(shinyApp(ui, server), launch.browser = TRUE) 

玩得開心!

+0

非常感謝你,這完美的作品!我無法理解你的所有步驟,但我會繼續研究它;) – mihasa