How to create Popup window of DataTable/plot in ShinyDashboard? - r

Question

I am creating ShinyDashboard which reads the csv file inputted by user and displays 2 plots at the top and datatable at the bottom of dashboards. For this I used box to built my Dashboard. Next, I would like create popup for each boxes so the box output displays bigger in size to the enduser. For this I am following the post mentioned here. However, whenever I use ModalDialog under ui code as suggested by Pork Chop. The table output doesn't return anything. Not sure if I am using ModalDialog correctly ? Below is my ui and server code.
Thank in advance for help and effort!
ui
library(shiny)
library(shinydashboard)
library(dplyr)
library(ggplot2)
library(shinyBS)
library(DT)
ui<-dashboardPage(
dashboardHeader(title="Missing",titleWidth = 230),
dashboardSidebar(
fileInput("file1", "Upload CSV File below",
accept = c(
"text/csv",
"text/comma-separated-values,text/plain",
".csv")
)),
dashboardBody(
fluidRow(
box(plotOutput("Plot1"),collapsible = TRUE,title="Columns ",solidHeader = TRUE,status = "primary"),
box(plotOutput("Plot2"),collapsible=TRUE,title="Columns data Type",solidHeader = TRUE,status = "primary"),
fluidRow(column(width=12,box( bsModal("modalExample", "Data Table", "My_datatable", size = "large",dataTableOutput("My_datatable")),width = NULL,collapsible = TRUE))
)
)
)
)
Server:
server<- function(input, output,session) {
output$Plot1 <- renderPlot({
plot(cars)
})
output$Plot2 <- renderPlot({ plot(pressure)})
output$My_datatable <- renderDT({iris[1:7,]})
}
# Run the application
shinyApp(ui = ui, server = server)

Answer 1

As shown in the answer you need to wrap each item you want to popout in a div() and give an id. Then use that id to popout and display what you wish. Try this
library(shiny)
library(shinydashboard)
library(dplyr)
library(ggplot2)
library(shinyBS)
library(DT)
#library(visdat)
ui<-dashboardPage(
dashboardHeader(title="Missing",titleWidth = 230),
dashboardSidebar(
fileInput("file1", "Upload CSV File below",
accept = c(
"text/csv",
"text/comma-separated-values,text/plain",
".csv")
)),
dashboardBody(
fluidRow(
div(id="popme1", box(plotOutput("Plot1"),collapsible = TRUE,title="Columns with null",solidHeader = TRUE,status = "primary")),
bsModal("modalExample1", "Plot1", "popme1", size = "large", plotOutput("Plot11")),
div(id="popme2", box(plotOutput("Plot2"),collapsible=TRUE,title="Data Types of columns",solidHeader = TRUE,status = "primary")),
bsModal("modalExample2", "Plot2", "popme2", size = "large", plotOutput("Plot22")),
div(id="popme3", fluidRow(column(width=8,box(DTOutput("Missing_datatable"), width = NULL,collapsible = TRUE)) )),
bsModal("modalExample3", "Data Table", "popme3", size = "large", DTOutput("Missing_datatable2"))
)
)
)
server<- function(input, output,session) {
output$Plot1 <- renderPlot({
plot(cars)
})
output$Plot11 <- renderPlot({
plot(cars)
})
output$Plot22 <- renderPlot({ plot(pressure)})
output$Plot2 <- renderPlot({ plot(pressure) })
output$Missing_datatable <- renderDT({iris[1:7,]})
output$Missing_datatable2 <- renderDT({iris[1:7,]})
}
# Run the application
shinyApp(ui = ui, server = server)