Not able to Remove previously inserted UI - r

in the below app, I am not able to remove previously inserted UI. Not sure why. Could anyone please help...............................................................
---
title: "Untitled"
runtime: shiny
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
---
```{r setup, include=FALSE}
library(flexdashboard)
library(rhandsontable)
```r
Column {data-width=650}
-----------------------------------------------------------------------
### Insert and Remove UI
```{r}
actionButton("add", "Add UI")
actionButton("rmv", "Remove UI")
observeEvent(input$add, {
insertUI(
selector = "#add",
where = "afterEnd",
ui = textInput(paste0("txt", input$add),
"Insert some text"),multiple = FALSE
)
})
observeEvent(input$rmv, {
removeUI(
selector = "div:has(< #txt)"
)
})
```
```

We can get the previous ids using seq_len(input$add) where input$add is 1,2,3,... etc, then construct a jQuery statment using paste0 and sprintf
---
title: "Untitled"
runtime: shiny
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
---
```{r setup, include=FALSE}
library(flexdashboard)
library(rhandsontable)
```
Column {data-width=650}
-----------------------------------------------------------------------
```{r}
### Insert and Remove UI
actionButton("add", "Add UI")
actionButton("rmv", "Remove UI")
observeEvent(input$add, {
insertUI(
selector = "#add",
where = "afterEnd",
ui = textInput(paste0("txt", input$add),
sprintf("Insert some text for %i",input$add)),multiple = FALSE
)
})
observeEvent(input$rmv, {
removeUI(
#Remove the last UI
#selector = sprintf("div:has(> #txt%i)",input$add),
#Remove all previous UIs
selector = sprintf("div:has(%s)",paste0('> #txt', seq_len(input$add), collapse = ",")),
immediate = TRUE,
multiple = TRUE
)
})
```
Update
Remove the last UI every time user click Remove UI
### Insert and Remove UI
actionButton("add", "Add UI")
actionButton("rmv", "Remove UI")
data = reactiveValues(tmp=0)
observeEvent(input$add, {
data$tmp <- c(data$tmp,input$add)
insertUI(
selector = "#add",
where = "afterEnd",
ui = textInput(paste0("txt", input$add),
sprintf("Insert some text for %i",input$add)),multiple = FALSE
)
})
observeEvent(input$rmv, {
rm <- tail(data$tmp, 1)
data$tmp <- setdiff(data$tmp, rm)
removeUI(
#Remove the last UI
#selector = sprintf("div:has(> #txt%i)",input$add),
#Remove all previous UIs
selector = sprintf("div:has(%s)",paste0('> #txt', rm, collapse = ",")),
immediate = TRUE,
multiple = TRUE
)
})

Related

Flexdashboard into Shiny

I am trying to adapt the RMarkdown file with *.rmd extension into Shiny application. My file has elements of Shiny but works with flexdashboard. Below you can see the code.
---
title: "Test"
author: " "
output:
flexdashboard::flex_dashboard:
orientation: columns
social: menu
source_code: embed
runtime: shiny
editor_options:
markdown:
wrap: 72
---
# Module 1
```{r global, include=FALSE}
library(biclust)
data(BicatYeast)
set.seed(1)
res <- biclust(BicatYeast, method=BCPlaid(), verbose=FALSE)
```
## Inputs {.sidebar}
```{r}
selectInput("clusterNum", label = h3("Cluster number"),
choices = list("1" = 1, "2" = 2),
selected = 1)
```
## Row {.tabset}
### Parallel Coordinates
```{r}
num <- reactive(as.integer(input$clusterNum))
renderPlot(
parallelCoordinates(BicatYeast, res, number=num()))
```
### Data for Selected Cluster
```{r}
renderTable(
BicatYeast[which(res#RowxNumber[, num()]), which(res#NumberxCol[num(), ])]
)
```
The shiny app usually has two main parts first is ui and second is server, so can anybody help how to solve this problem and run this file as a Shiny app.
library(shiny)
library(biclust)
ui <- fluidPage(
selectInput("clusterNum",
label = h3("Cluster number"),
choices = list("1" = 1, "2" = 2),
selected = 1
),
plotOutput("plot"),
tableOutput("table")
)
server <- function(input, output, session) {
set.seed(1)
data(BicatYeast)
res <- biclust(BicatYeast, method = BCPlaid(), verbose = FALSE)
num <- reactive(as.integer(input$clusterNum))
output$plot <-
renderPlot(
parallelCoordinates(BicatYeast, res, number = num())
)
output$table <-
renderTable(
BicatYeast[which(res#RowxNumber[, num()]), which(res#NumberxCol[num(), ])]
)
}
shinyApp(ui, server)

Embed a website in shiny app using flexdashboard: not working, not reactive

I am trying to make a shinyapp using flexdashboard. The app takes as input a string of text, and then it outputs a website using that input text. I have an example of the app working in standard shiny. My problem is "translating" it to an app using flexdashboard.
Here is my app in standard shiny:
library(shiny)
ui <- fluidPage(titlePanel("Testing"),
sidebarLayout(
sidebarPanel(
fluidRow(
column(9, selectInput("Color", label=h5("Choose a color"),choices=c('red', 'blue'))
))),
mainPanel(fluidRow(
htmlOutput("frame")
)
)
))
server <- function(input, output) {
observe({
query <- input$Color
test <<- paste0("https://en.wikipedia.org/wiki/",query)
})
output$frame <- renderUI({
input$Color
my_test <- tags$iframe(src=test, height=600, width=535, frameborder = "no")
print(my_test)
my_test
})
}
shinyApp(ui, server)
Here is my attempt trying to get it to work using flexdashboards. I am having problem trying to get the input as a reactive expression to make my output dynamic. I am trying 2 different ways to get the output, but none work.
---
title: "Testing Colors"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(knitr)
lookup <- structure(c("r", "b"), .Names = c("Red", "Blue"))
Column {.sidebar}
-----------------------------------------------------------------------
```{r}
selectInput('Color', label = 'Select a color', choices = lookup, selected = "r")
Column {data-width=600}
-----------------------------------------------------------------------
### Color Web Page
```{r}
observeEvent(input$Color,{
output$url <-renderUI(a(href=paste0("https://en.wikipedia.org/wiki/", input$Color)))
})
Column {data-width=400}
-----------------------------------------------------------------------
### Another webpage
```{r}
selectedColor<- reactive({
color <- input$Color
})
webpage <- renderUI({
include_url(paste0("https://www.wikipedia.org/",selectedColor))
})
webpage
I would certainly appreciate any comments or ideas.
Thanks!
This code gave me a flexdashboard back with the selectInput, I think the alignment of spaces made for errors
---
title: "Testing Colors"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(knitr)
lookup <- structure(c("r", "b"), .Names = c("Red", "Blue"))
```
```{r,}
selectInput('Color', label = 'Select a color', choices = lookup, selected = "r")
```
Column {data-width=600}
-----------------------------------------------------------------------
### Color Web Page
```{r}
observeEvent(input$Color,{
output$url <-renderUI(a(href=paste0("https://en.wikipedia.org/wiki/", input$Color)))
})
```
Column {data-width=400}
-----------------------------------------------------------------------
### Another webpage
```{r}
selectedColor<- reactive({
color <- input$Color
})
webpage <- renderUI({
include_url(paste0("https://www.wikipedia.org/",selectedColor))
})
webpage

R Flex Dashboard (Shiny): Dynamic behavior between checkboxgroupinput and selectinput. Prevent selectInput to go back to default values

When I check the check boxes, drop down appears with a default value selected. I change selection in drop down and when I uncheck the check box, the value in the drop down goes back to default. I want to retain the values in the dropdown. Here is my reproducible code:
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(shiny)
library(shinydashboard)
```
Column {.sidebar}
-----------------------------------------------------------------------
```{r}
cars <- mtcars
checkboxGroupInput("rowfilters", "Select row filters:",
c("Cylinder" = "cyl",
"Gear" = "gear"))
renderUI({
if("cyl" %in% input$rowfilters){
selectInput('CYL', label = "Select Cylinder:",
choices = as.character(unique(cars$cyl)), multiple = TRUE,
selected = "6")
}
})
renderUI({
if("gear" %in% input$rowfilters){
selectInput('GEAR', label = "Select Gear:",
choices = as.character(unique(cars$gear)), multiple = TRUE,
selected = "4")
}
})
```
Here when I check "Cylinder" and "Gear", two dropdowns "Select Cylinder", and "Select Gear" appear with a default values. I now change the value in "Select Cylinder:" to 6,4 and 8. Now when I uncheck "Gear", the dropdown "Select Gear" disappears, which is what I want. However, the value in "Select Cylinder" goes back to default value "6". I want "Select Cylinder" to retain my previous selection 6,4, and 8.
Please let me know if you have any suggestions? Thank you.
Problem
The reason why your code works this way is that your renderUI depends on the checkboxGroupInput, so whenever you tick the checkboxes your app is actually rerendering the selectInput-s with the default values.
Suggestion
My suggestion would be to render all the inputs, but hide the selectInput-s initially. Upon using the checkboxGroupInput, you can then toggle the visibilty of the elements.
This way they don't get rerendered and thus their values will stay the same.
Solution
We are going to use the shinyjs package as it allows us to hide/show elements, etc.
Include useShinyjs(rmd = TRUE)
In order to use shinyjs with flexdashboard you need to include the useShinyjs function in the R chunk.
Render the two selectInput
We will render the selectInput on init, but hide them with the hidden function from shinyjs.
hidden(selectInput(
"CYL", label = "Select Cylinder:",
choices = as.character(unique(cars$cyl)), multiple = TRUE,
selected = "6"
))
hidden(selectInput(
"GEAR", label = "Select Gear:",
choices = as.character(unique(cars$gear)), multiple = TRUE,
selected = "4"
))
Add observers for toggling visibilty.
We can toggle visibility on and off for the selectInput based on the value of the checkboxGroupInput.
observe( {
if("cyl" %in% input$rowfilters) {
shinyjs::show("CYL")
} else {
shinyjs::hide("CYL")
}
})
observe( {
if("gear" %in% input$rowfilters) {
shinyjs::show("GEAR")
} else {
shinyjs::hide("GEAR")
}
})
Complete code
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
library(shiny)
library(shinydashboard)
library(shinyjs)
```
Column {.sidebar}
-----------------------------------------------------------------------
```{r}
useShinyjs(rmd = TRUE)
observe( {
if("cyl" %in% input$rowfilters) {
shinyjs::show("CYL")
} else {
shinyjs::hide("CYL")
}
})
observe( {
if("gear" %in% input$rowfilters) {
shinyjs::show("GEAR")
} else {
shinyjs::hide("GEAR")
}
})
cars <- mtcars
checkboxGroupInput(
"rowfilters", "Select row filters:",
c(
"Cylinder" = "cyl",
"Gear" = "gear"
)
)
hidden(selectInput(
"CYL", label = "Select Cylinder:",
choices = as.character(unique(cars$cyl)), multiple = TRUE,
selected = "6"
))
hidden(selectInput(
"GEAR", label = "Select Gear:",
choices = as.character(unique(cars$gear)), multiple = TRUE,
selected = "4"
))
```

Flexdashboard doesn't work with Shiny URL state

I am trying to combine flexdashboard with Shiny state bookmarking. When used alone (example from the docs) Shiny app works fine, but when put in flexdasboard, url is not updated:
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
library(flexdashboard)
```
Column {data-width=650}
-----------------------------------------------------------------------
### Chart A
```{r}
shinyApp(
ui=function(req) {
fluidPage(
textInput("txt", "Text"),
checkboxInput("chk", "Checkbox")
)
},
server=function(input, output, session) {
observe({
# Trigger this observer every time an input changes
reactiveValuesToList(input)
session$doBookmark()
})
onBookmarked(function(url) {
updateQueryString(url)
})
},
enableBookmarking = "url"
)
```
Is this even possible? Compared to standalone execution:
shinyApp(
ui=function(req) {
fluidPage(
textInput("txt", "Text"),
checkboxInput("chk", "Checkbox")
)
},
server=function(input, output, session) {
observe({
# Trigger this observer every time an input changes
reactiveValuesToList(input)
session$doBookmark()
})
onBookmarked(function(url) {
updateQueryString(url)
})
},
enableBookmarking = "url"
)
it looks like onBookmarked (and similar events like onBookmark, onRestore and onRestored) are never triggered.
Bookmarking isn't supported in Shiny apps embedded in R Markdown documents.
See discussion here: https://github.com/rstudio/shiny/pull/1209#issuecomment-227207713
Sounds like it's technically possible, but tricky to do. For example, what happens if there are multiple apps embedded in the document? Also, apps are embedded as iframes, so there would have to be some wiring up to be done to allow these apps to access/modify their parent window's URL.
However, bookmarking does work with embedded Shiny components (rather than full applications).
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
enableBookmarking("url")
```
```{r, include=FALSE}
observe({
reactiveValuesToList(input)
session$doBookmark()
})
onBookmarked(function(url) {
updateQueryString(url)
})
output$content <- renderUI({
tagList(
textInput("txt", "Text"),
checkboxInput("chk", "Checkbox")
)
})
```
Column {data-width=650}
-----------------------------------------------------------------------
### Chart A
```{r}
fluidPage(
uiOutput("content"),
selectInput("sel", label = "Select", choices = c(10, 20, 30), selected = 10)
)
```
You can also use Prerendered Shiny Documents, although bookmarking would not work 100% the same since the UI is pre-rendered. Any static UI would have to be manually restored with bookmarking callbacks, but dynamic UI would be restored just fine.
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
runtime: shiny_prerendered
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
enableBookmarking("url")
```
```{r, context="server"}
observe({
reactiveValuesToList(input)
session$doBookmark()
})
onBookmarked(function(url) {
updateQueryString(url)
})
# Static inputs are pre-rendered, and must be manually restored
onRestored(function(state) {
updateSelectInput(session, "sel", selected = state$input$sel)
})
# Dynamic inputs will be restored with no extra effort
output$content <- renderUI({
tagList(
textInput("txt", "Text"),
checkboxInput("chk", "Checkbox")
)
})
```
Column {data-width=650}
-----------------------------------------------------------------------
### Chart A
```{r}
fluidPage(
uiOutput("content"),
selectInput("sel", label = "Select", choices = c(10, 20, 30), selected = 10)
)
```

Flex dashboard: Input and Outputs in different tabs

I´m a newby with flex-dashboards...
How can I separate in two different tabs the input information and output results? here is a simple example, I am trying to render only the barplot in the second tab "Output"
---
title: "Dashboard"
output:
flexdashboard::flex_dashboard:
runtime: shiny
---
```{r global, include=FALSE}
# load data in 'global' chunk so it can be shared by all users of the dashboard
library(datasets)
data(WorldPhones)
```
Inputs
=======================================================================
```{r, include=FALSE}
# Shiny module definition (would typically be defined in a separate R script)
# UI function
worldPhonesUI <- function(id) {
ns <- NS(id)
fillCol(height = 600, flex = c(2, 1),
inputPanel(
selectInput(ns("region"), "Region1:", choices = colnames(WorldPhones))
)
)
}
# Server function
worldPhones <- function(input, output, session) {
output$phonePlot <- renderPlot({
barplot(WorldPhones[,input$region]*1000,
ylab = "Number of Telephones", xlab = "Year")
})
}
```
```{r, eval=TRUE}
# Include the module
worldPhonesUI("phones")
callModule(worldPhones, "phones")
```
Results
=======================================================================
```{r}
worldPhonesUI <- function(id) {
ns <- NS(id)
fillCol(height = 600, flex = c(NA, 1),
plotOutput(ns("phonePlot"), height = "80%")
)
}
```
you forget everything about ui and server functions and put directly objects in chucks like this:
---
title: "Dashboard"
output:
flexdashboard::flex_dashboard:
runtime: shiny
---
```{r global, include=FALSE}
# load data in 'global' chunk so it can be shared by all users of the dashboard
library(datasets)
data(WorldPhones)
```
Inputs
=======================================================================
```{r}
selectInput("region", "Region1:", choices = colnames(WorldPhones))
```
Results
=======================================================================
```{r}
renderPlot({
barplot(WorldPhones[,input$region]*1000,
ylab = "Number of Telephones", xlab = "Year")
})
```

Resources