Change color of action button

2
votes

I would like to know if it is possible to change the color of an actionButton within an observeEvent.

In ui I have :

actionButton("bell","",icon=icon("bell"),
                           class = "btn action-button",
                           style = "color: white;
                           background-color: blue")

In server.R, my observeEvent is : 

observeEvent(data_moment[1,c("facebook")]=="NA", {
    disable("bell")
})

What I want :

If data_moment[1,c("facebook")]=="NA" I would like to disable the bell button, and set its color to grey.

Do you know how I can do ?

2
rshiny

2 Answers

3
votes

Just add a css rule for disabled Buttons in you css file

.btn.disabled {
    background-color: red;
}

if you don't have any separate css-file you can add it to your UI with a script tag like this

library(shiny)
runApp(shinyApp(
  ui = fluidPage(
    shinyjs::useShinyjs(),
    tags$style(".btn.disabled {
    background-color: red;
    }"),
    actionButton("test", "Test"),
    actionButton("submit", "Choose")
  ),
server = function(input, output, session) {
  observeEvent(input$submit, {
    shinyjs::disable("test")
  })
  }
))
3
votes

Based on this answer

Ui:

uiOutput("button")

Server: 

    output$button <-  renderUI({
          if(is.na(data_moment[1,c("facebook")])){
            actionButton(inputId= "bell","", 
                         style = "color: white; 
                         background-color: ...; 

                         ") 
   disable("bell")
          }
else {
actionButton(inputId= "bell","", 
                         style = "color: white; 
                         background-color: blue; 
                         ")}

    })