Change color actionButton when button clicked Shiny R

Question

I have an actionButton defined in the UI as uiOutput("DartSearchAdv"). I would like the button to change color when input$target_min_ab is changed. And when input$DartSearchAdv is pressed, I want the color to go back to default.

I've tried implementing the suggestion here , and the color change will work as desired, but certain outputs generated from the button press are hidden ("mainPanelDST"). I can try getting them to appear if I do show("mainPanelDST"), but then the color change doesn't take place, or the button will disappear until input$target_min_ab is interacted with again.

Below is the relevant code from the server.

global <- reactiveValues(clicked = FALSE)

# Desired style for when button is clicked
defaultColor = 'padding:10px; font-size:120%;
         color: white; background-color: #3E668E;
         border-color: #2C3E50'

# Desired style for when a setting is changed
updateColor = 'padding:10px; font-size:120%;
       color: white; background-color: #428BCA;
       border-color: #95A5A6'

# render the button
output$DartSearchAdv <- renderUI({
      if (global$clicked){
        actionButton("DartSearchAdv", "Update Search",
                     style = defaultColor)
      } else {
        actionButton("DartSearchAdv", "Update Search",
                     style = updateColor)
      }
      
    })

And here are the inputs that should change the color

# input that changes color to updateColor
observeEvent(input$target_min_ab,{
  rv$target_min_ab = input$target_min_ab/100; 
  global$clicked = FALSE; 
})

# input that changes color to default
trigger_button2 <- eventReactive(input$DartSearchAdv, {
# Do stuff in here
global$clicked = TRUE

}

Answer 1

Perhaps this:

library(shiny)

# Desired style for when button is clicked
defaultColor <- "padding:10px; font-size:120%;
         color: white; background-color: #3E668E;
         border-color: #2C3E50"

# Desired style for when a setting is changed
updateColor <- "padding:10px; font-size:120%;
       color: white; background-color: #428BCA;
       border-color: #95A5A6"


ui <- fluidPage(
  uiOutput("DartSearchAdv"), # will be an actionButton
  numericInput("target_min_ab", "Target Min Ab", 1),
  actionButton("DartSearchAdv", "DartSearchAdv")
)


server <- function(input, output, session) {
  global <- reactiveValues(clicked = FALSE)
  rv <- reactiveValues(target_min_ab = NULL)


  # render the button
  output$DartSearchAdv <- renderUI({
    if (global$clicked) {
      actionButton("DartSearchAdv", "Update Search",
        style = defaultColor
      )
    } else {
      actionButton("DartSearchAdv", "Update Search",
        style = updateColor
      )
    }
  })


  observeEvent(input$target_min_ab,
    {
      rv$target_min_ab <- input$target_min_ab / 100
      global$clicked <- TRUE
    },
    ignoreInit = TRUE
  )

  observeEvent(input$DartSearchAdv, {
    global$clicked <- FALSE
  })
}



shinyApp(ui, server)