Very simple question: In my shiny UI, I have two buttons, A and B
on the click of button B I would like button A to be hidden, but I don't think updateActionButton has this capability. So how is this accomplished?
Thanks in advance
Dean built wonderful shinyjs package that has this functionality. Note that I added toggle instead of hide but you can switch if you like
rm(list = ls())
library(shiny)
library(shinyjs)
ui <- fluidPage(
useShinyjs(),
actionButton("hide","a"),
actionButton("b","b")
)
server <- shinyServer(function(input,output){
observeEvent(input$hide,{
toggle("b")
})
})
runApp(list(ui = ui, server = server))
Related
I would like to integrate captcha verification into my shiny app (like this). But it has an unexpected behavior.
If this line:
recaptchaUI("test", sitekey = "6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI")
is inside the UI, my app works fine (I mean, the validation is triggered when the checkbox and the button are clicked)
However, if it is inside renderUI, the validation is triggered only by clicking the checkbox (there is no need to click the button)
Here is my minimal working example:
library(shiny)
library(shinyCAPTCHA)
ui <- fluidPage(
# With this line, the captcha works perfectly
recaptchaUI("test", sitekey = "6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI"),
uiOutput("body")
)
server <- function(input, output, session) {
result <- callModule(recaptcha, "test", secret = "6LeIxAcTAAAAAGG-vFI1TnRWxMZNFuojJ4WifJWe")
output$body <- renderUI({
fluidPage(
# Inside renderUI, it does not work properly.
#recaptchaUI("test", sitekey = "6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI"),
uiOutput("humansOnly")
)
})
output$humansOnly <- renderUI({
req(result()$success)
tags$h1("For human eyes only!")
})
}
shinyApp(ui, server)
I have an app with several modules, that's why I need to use renderUI. What is the error in my code?
I appreciate any help!
I am building a shiny app and I am using two sidebarLayouts. I’m looking for a way to minimize them. I have try put each sidebarLayout into a box.
Example code:
library(shiny)
library(shinyjs)
ui <- fluidPage(
useShinyjs(),
headerPanel("Here goes the heder"),
box(sidebarLayout(
sidebarPanel(textOutput("someinputs")),
mainPanel(textOutput("someoutputs"))),
width = 12,
title = "BB",
collapsible = T,
collapsed = F
)
)
server <- function(input, output) {
output$someinputs <- renderText({
"Here will go the inputs"
})
output$someoutputs <- renderText({
"Here will go the outputs"
})
}
shinyApp(ui, server)
Output:
When I press the collapsible button the Layout does not collapse. Why is this happening? What should I do? Is there other way to do this?
Because you didn't use shinydashboard. The box comes from shinydashboard package. You need to use shinydashboard::dashboardPage instead of fluidPage.
dashboardPage Loads required javascripts and CSS files to toggle the button.
library(shiny)
ui <- shinydashboard::dashboardPage(
shinydashboard::dashboardHeader(),
shinydashboard::dashboardSidebar(),
shinydashboard::dashboardBody(
headerPanel("Here goes the heder"),
shinydashboard::box(
width = 12,
title = "BB",
collapsible = TRUE,
collapsed = FALSE,
sidebarLayout(
sidebarPanel(textOutput("someinputs")),
mainPanel(textOutput("someoutputs")))
)
)
)
If you don't want to use dashboardPage, you can write your own scripts to control the button:
library(magrittr)
library(shiny)
ui <- fluidPage(
headerPanel("Here goes the heder"),
shinydashboard::box(
width = 12,
title = "BB",
collapsible = TRUE,
collapsed = FALSE,
sidebarLayout(
sidebarPanel(textOutput("someinputs")),
mainPanel(textOutput("someoutputs")))
)%>% {.$attribs[['id']] <- 'example-box'; .},
tags$head(tags$script(
"$(document).ready(function(){
$('#example-box button').attr({
'data-toggle':'collapse',
'data-target':'#example-box .box-body',
'aria-expanded':false
})
})"
))
)
I used a hack to assign an ID to the box %>% {.$attribs[['id']] <- 'example-box'; .}, and use some jquery to control the button. Be sure the ID in the script matches the ID you assign in UI, example-box in this case. In javascript, you add # for ID searching, so #example-box.
I wouldn't recommend you to use the second way. You can see in your UI, it's not really a box. It has no border and the button is not at the right place. If you use dashboardPage, you can see the difference.
I am new to Shiny. And I was wondering how could I combine radio button with numericInput ? My target is like this. Thanks in advance.
target.
Actually I have no idea how to combine the radio button with numericInput. So I only have a simple example with radio button so far.
library(shiny)
ui <- shinyUI(fluidPage(
tags$h4("Select Method for Testing"),
radioButtons('testing', '',
c("Fraction of cases selected at random",
"K-fold cross-validation"))
))
server<-function(input, output,session) {
}
shinyApp(ui = ui, server = server)
I am building a shiny app which has a lot of conditional panel. I have a back button in the app itself to navigate between the conditional panel. I would like to disable the web browsers back button as clicking that button goes to previous webpage(away from my app). Is there a way to do this?
You can write some javascript to do this. Here I have two examples, note that I only tested this on Chrome
Example 1 will return a message upon activation of the back button within the browser
rm(list = ls())
library(shiny)
jscode <- 'window.onbeforeunload = function() { return "Please use the button on the webpage"; };'
ui <- basicPage(
mainPanel(tags$head(tags$script(jscode)))
)
server <- function(input, output,session) {}
runApp(list(ui = ui, server = server))
Example 2 will disable navigation altogether. Personally I don't like this method as people might be annoyed that your site doesn't offer standard navigation functionalities
rm(list = ls())
library(shiny)
jscode2 <- "history.pushState(null, null, document.title);
window.addEventListener('popstate', function () {
history.pushState(null, null, document.title);});"
ui <- basicPage(
mainPanel(tags$head(tags$script(jscode2)))
)
server <- function(input, output,session) {}
runApp(list(ui = ui, server = server))
I'm trying to collapse a box programmatically when an input changes. It seems that I only need to add the class "collapsed-box" to the box, I tried to use the shinyjs function addClass, but I don't know how to do that becuase a box doesn't have an id. Here as simple basic code that can be used to test possible solutions:
library(shinydashboard)
ui <- dashboardPage(
dashboardHeader(),
dashboardSidebar(),
dashboardBody(
box(collapsible = TRUE,p("Test")),
actionButton("bt1", "Collapse")
)
)
server <- function(input, output) {
observeEvent(input$bt1, {
# collapse the box
})
}
shinyApp(ui, server)
I've never tried using boxes before so keep in mind that my answer might be very narrow minded. But I took a quick look and it looks like simply setting the "collapsed-box" class on the box does not actually make the box collapse. So instead my next thought was to actually click the collapse button programatically.
As you said, there isn't an identifier associated with the box, so my solution was to add an id argument to box. I initially expected that to be the id of the box, but instead it looks like that id is given to an element inside the box. No problem - it just means that in order to select the collapse button, we need to take the id, look up the DOM tree to find the box element, and then look back down the DOM tree to find the button.
I hope everything I said makes sense. Even if it doesn't, this code should still work and will hopefully make things a little more clear :)
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, functions = "collapse"),
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)