wizkids121
wizkids121

Reputation: 656

Shiny Dashboards Dropdown

So I have a dashboard in Shiny. It's just simple table that looks like [the image found in this link][1] (apologies that I can't give you something more reproducible. Not sure how I would do that.)

Upvotes: 0

Views: 1222

Answers (1)

Valter Beaković
Valter Beaković

Reputation: 3250

A working shiny app:

ui.R

    library(shiny)
    library(DT)
    library(htmltools)

    fluidPage(
            title = 'DataTables Information',
            h1('A client-side table'),
            fluidRow(
                    column(12, 
                           selectInput("speciesSelector", 
                                       "Select species", 
                                       choices = c("All", levels(iris$Species)), 
                                       selected = "All"),
                           DT::dataTableOutput('iris')
                           )
            )
    )

server.R

    library(shiny)
    library(DT)
    library(htmltools)
    sketch <- htmltools::withTags(table(
            class = "display",
            style = "bootstrap",
            tableHeader(c("ID", colnames(iris))),
            tableFooter(c("ID", colnames(iris)))
    ))

    shinyServer(function(input, output, session) {
            data <- reactive({
                    data <- iris
                    if (input$speciesSelector != "All") {
                            data <- data[data$Species == input$speciesSelector,]
                    }
                    data
            })        

            # render the table (with row names)
            output$iris = DT::renderDataTable(data(), 
                                              container = sketch, 
                                              server = FALSE,  
                                              caption = "Column sum example", 
                                              filter = "top",  options = list(footerCallback = JS(
                                                    "function( tfoot, data, start, end, display ) {",
                                                    "var api = this.api(), data;",
                                                    "total = api.column( 4, { page: 'current'} ).data().reduce( function ( a, b ) {return a + b;} )",
                                                    "total1 = api.column( 4, { search:'applied'} ).data().reduce( function ( a, b ) {return a + b;} )",
                                                    "$( api.column( 4 ).footer() ).html(total.toFixed(2) + ' / ' + total1.toFixed(2));",
                                                    "}")))
    })

Upvotes: 2

Related Questions