2017-08-02 18 views
0

我试图找到一种方法来检查闪亮的仪表板框是否折叠或展开。如何查看是否从服务器端折叠了闪亮的仪表板框

通过读取由@daattali大答复中How to manually collapse a box in shiny dashboard我知道有可能通过使用shinyjs包塌陷从服务器侧的盒,如在示出的代码下面

library(shiny) 
library(shinydashboard) 
library(shinyjs) 

jscode <- " 
shinyjs.collapse = function(boxid) { 
$('#' + boxid).closest('.box').find('[data-widget=collapse]').click(); 
} 
" 

ui <- dashboardPage(
    dashboardHeader(), 
    dashboardSidebar(), 
    dashboardBody(
    useShinyjs(), 
    extendShinyjs(text = jscode), 
    actionButton("bt1", "Collapse box1"), 
    actionButton("bt2", "Collapse box2"), 
    br(), br(), 
    box(id = "box1", collapsible = TRUE, p("Box 1")), 
    box(id = "box2", collapsible = TRUE, p("Box 2")) 
) 
) 

server <- function(input, output) { 
    observeEvent(input$bt1, { 
    js$collapse("box1") 
    }) 
    observeEvent(input$bt2, { 
    js$collapse("box2") 
    }) 
} 

shinyApp(ui, server) 

通过检查UI HTML我发现通过访问图标类可以解决我的问题(查看它是fa fa-plus还是fa fa-minus),但我不知道该怎么做。

任何帮助将不胜感激。

干杯

回答

0

您可以创建一个新的输入,触发当用户折叠箱,像这样的东西:

collapseInput <- function(inputId, boxId) { 
    tags$script(
    sprintf(
     "$('#%s').closest('.box').on('hidden.bs.collapse', function() {Shiny.onInputChange('%s', true);})", 
     boxId, inputId 
    ), 
    sprintf(
     "$('#%s').closest('.box').on('shown.bs.collapse', function() {Shiny.onInputChange('%s', false);})", 
     boxId, inputId 
    ) 
) 
} 

随着您例如:

library(shiny) 
library(shinydashboard) 
library(shinyjs) 

jscode <- " 
shinyjs.collapse = function(boxid) { 
$('#' + boxid).closest('.box').find('[data-widget=collapse]').click(); 
} 
" 
collapseInput <- function(inputId, boxId) { 
    tags$script(
    sprintf(
     "$('#%s').closest('.box').on('hidden.bs.collapse', function() {Shiny.onInputChange('%s', true);})", 
     boxId, inputId 
    ), 
    sprintf(
     "$('#%s').closest('.box').on('shown.bs.collapse', function() {Shiny.onInputChange('%s', false);})", 
     boxId, inputId 
    ) 
) 
} 


ui <- dashboardPage(
    dashboardHeader(), 
    dashboardSidebar(), 
    dashboardBody(
    useShinyjs(), 
    extendShinyjs(text = jscode), 
    actionButton("bt1", "Collapse box1"), 
    actionButton("bt2", "Collapse box2"), 
    br(), br(), 
    box(id = "box1", collapsible = TRUE, p("Box 1")), 
    box(id = "box2", collapsible = TRUE, p("Box 2")), 
    collapseInput(inputId = "iscollapsebox1", boxId = "box1"), 
    verbatimTextOutput(outputId = "res") 
) 
) 

server <- function(input, output) { 
    observeEvent(input$bt1, { 
    js$collapse("box1") 
    }) 
    observeEvent(input$bt2, { 
    js$collapse("box2") 
    }) 

    output$res <- renderPrint({ 
    input$iscollapsebox1 
    }) 
} 

shinyApp(ui, server) 

您可以更改true/false'collapse'/'expanded'在功能collapseInput当它调用Shiny.onInputChange如果你想。

+0

非常感谢你@Victorp,我从来没有想过这件事! –

相关问题