shinydashboardのタブ固有のサイドバー

Question

onclickタイプイベントがタブセット内のタブ間を移動できるようにするには、Rでshinyjsパッケージを使用しています。各タブには特定のサイドバーがあり、各タブの間に複数の方法（つまり、タブ自体をクリックするか、valueBoxをクリックする）があります。私は正しいサイドバーがロードされる特定のタブにどのような方法でアクセスしても問題ないことを確認したいと思います。上記のコードで

# load libraries 
require(shiny) 
require(shinydashboard) 
require(shinyjs) 

# create a simple app 
ui <- dashboardPage(
    title='Loading graphs', 
    dashboardHeader(
    title = 'Loading Graphs' 
), 
    dashboardSidebar(
    div(id='tab1_sidebar', 
     sliderInput('tab1_slider', 'tab1 slider', min=2,max=7,value=2)), 
    shinyjs::hidden(
     div(id='tab2_sidebar', 
      sliderInput('tab2_slider', 'tab2 slider', min=2,max=7,value=2)) 
    ) 
), 
    dashboardBody(
    useShinyjs(), 
    tabsetPanel(
     id = "navbar", 
     tabPanel(title="tab1 title",id="tab1",value='tab1_val', 
       valueBoxOutput('tab1_valuebox')), 
     tabPanel(title="tab2 title",id="tab2",value='tab2_val', 
       valueBoxOutput('tab2_valuebox')) 
    ) 
) 
) 

server <- shinyServer(function(input, output, session) { 

    output$tab1_valuebox <- renderValueBox({ 
    valueBox('1000',subtitle = "blah blah",icon = icon("car"), 
      color = "blue" 
    ) 
    }) 

    output$tab2_valuebox <- renderValueBox({ 
    valueBox('2000',subtitle = "blah2 blah2",icon = icon("car"), 
      color = "red" 
    ) 
    }) 



    # on click of a tab1 valuebox 
    shinyjs::onclick('tab1_valuebox',expr={ 
    # move to tab2 
    updateTabsetPanel(session, "navbar", 'tab2_val') 
    # update the sidebar to match the tab 
    toggle('tab1_sidebar') 
    toggle('tab2_sidebar') 
    }) 

    # on click of a tab2 valuebox 
    shinyjs::onclick('tab2_valuebox',expr={ 
    # move to tab2 
    updateTabsetPanel(session, "navbar", 'tab1_val') 
    # update the sidebar to match the tab 
    toggle('tab1_sidebar') 
    toggle('tab2_sidebar') 
    }) 
}) 

shinyApp(ui=ui,server=server) 

、タブをクリックしたときにサイドバーは変更されませんが、私はタブをクリックを可能取るために、サーバー・コンポーネントに以下のコードが含まれている場合、正しく調整していないようです...

# change sidebar based on navbar value.... 
observeEvent(input$navbar,{ 
    if(input$navbar=='tab1_val'){ 
     toggle('tab1_sidebar') 
     toggle('tab2_sidebar') 
    } else if(input$navbar=='tab2_val'){ 
     toggle('tab1_sidebar') 
     toggle('tab2_sidebar') 
    } 
}) 

この上の任意の助けもいただければ幸いです....

Answer 1

今あなたが切り替えたときに更新するには、スライダを伝え、あなたのコード内の任意のロジックを持っているように、それは見ていませんタブをクリックしたときにのみ表示されます。

これについては、さまざまなアプローチがあります。

オプション1：リスニングではなく、クリックがあるたびにtoggle()関数を呼び出すのナビゲーションバーの変化とこれはあなたのコードに非常によく似てcondition

で使用toggle()が、すべては私がやるのonclickであります選択したタブを変更します。タブの値が変わると（valueBoxをクリックするか、タブをクリックして）、toggle()関数を呼び出します。小さいが重要な違い。

# load libraries 
require(shiny) 
require(shinydashboard) 
require(shinyjs) 

# create a simple app 
ui <- dashboardPage(
    title='Loading graphs', 
    dashboardHeader(
    title = 'Loading Graphs' 
), 
    dashboardSidebar(
    div(id='tab1_sidebar', 
     sliderInput('tab1_slider', 'tab1 slider', min=2,max=7,value=2)), 
    shinyjs::hidden(
     div(id='tab2_sidebar', 
      sliderInput('tab2_slider', 'tab2 slider', min=2,max=7,value=2)) 
    ) 
), 
    dashboardBody(
    useShinyjs(), 
    tabsetPanel(
     id = "navbar", 
     tabPanel(title="tab1 title",id="tab1",value='tab1_val', 
       valueBoxOutput('tab1_valuebox')), 
     tabPanel(title="tab2 title",id="tab2",value='tab2_val', 
       valueBoxOutput('tab2_valuebox')) 
    ) 
) 
) 

server <- shinyServer(function(input, output, session) { 

    values <- reactiveValues(selectedTab = 1) 

    observeEvent(input$navbar, { 
    toggle("tab1_sidebar", condition = input$navbar == "tab1_val") 
    toggle("tab2_sidebar", condition = input$navbar == "tab2_val") 
    }) 

    output$tab1_valuebox <- renderValueBox({ 
    valueBox('1000',subtitle = "blah blah",icon = icon("car"), 
      color = "blue" 
    ) 
    }) 

    output$tab2_valuebox <- renderValueBox({ 
    valueBox('2000',subtitle = "blah2 blah2",icon = icon("car"), 
      color = "red" 
    ) 
    }) 



    # on click of a tab1 valuebox 
    shinyjs::onclick('tab1_valuebox',expr={ 
    # move to tab2 
    updateTabsetPanel(session, "navbar", 'tab2_val') 
    }) 

    # on click of a tab2 valuebox 
    shinyjs::onclick('tab2_valuebox',expr={ 
    # move to tab2 
    updateTabsetPanel(session, "navbar", 'tab1_val') 
    }) 
}) 

shinyApp(ui=ui,server=server) 

オプション2：shinyjsの著者としてconditionalPanel()

を使用して、私はtoggle機能を愛し、それは絶対に必要ではありません、この場合には、あなただけのconditionalPanel()を使用して逃げることができました。ここにあなたが望むと思うコードがあります：

# load libraries 
require(shiny) 
require(shinydashboard) 
require(shinyjs) 

# create a simple app 
ui <- dashboardPage(
    title='Loading graphs', 
    dashboardHeader(
    title = 'Loading Graphs' 
), 
    dashboardSidebar(
    conditionalPanel("input.navbar == 'tab1_val'", 
     div(id='tab1_sidebar', 
      sliderInput('tab1_slider', 'tab1 slider', min=2,max=7,value=2)) 
    ), 
    conditionalPanel("input.navbar == 'tab2_val'", 
     div(id='tab2_sidebar', 
      sliderInput('tab2_slider', 'tab2 slider', min=2,max=7,value=2)) 
    ) 
), 
    dashboardBody(
    useShinyjs(), 
    tabsetPanel(
     id = "navbar", 
     tabPanel(title="tab1 title",id="tab1",value='tab1_val', 
       valueBoxOutput('tab1_valuebox')), 
     tabPanel(title="tab2 title",id="tab2",value='tab2_val', 
       valueBoxOutput('tab2_valuebox')) 
    ) 
) 
) 

server <- shinyServer(function(input, output, session) { 

    output$tab1_valuebox <- renderValueBox({ 
    valueBox('1000',subtitle = "blah blah",icon = icon("car"), 
      color = "blue" 
    ) 
    }) 

    output$tab2_valuebox <- renderValueBox({ 
    valueBox('2000',subtitle = "blah2 blah2",icon = icon("car"), 
      color = "red" 
    ) 
    }) 



    # on click of a tab1 valuebox 
    shinyjs::onclick('tab1_valuebox',expr={ 
    # move to tab2 
    updateTabsetPanel(session, "navbar", 'tab2_val') 
    }) 

    # on click of a tab2 valuebox 
    shinyjs::onclick('tab2_valuebox',expr={ 
    # move to tab2 
    updateTabsetPanel(session, "navbar", 'tab1_val') 
    }) 
}) 

shinyApp(ui=ui,server=server)