How to replace a table with new data using actionButton

Hi,
I am learning to use shiny and want to write an app that would allow the display of an emergency rota at work as well as letting someone submit a shift that they've done. On submission, the rota will update with the person going to the bottom of the rota. This is all linked to a file in Google Sheets.
I want the app to first display the current rota, then on submission of a shift, it would display the new rota. However, I am having trouble thinking of a way of doing this. Ideally, a single action button would trigger all the things that I want the app to do.


ui <- dashboardPage(
  
  dashboardHeader(title = "Disaster Rota"),
  
  dashboardSidebar(disable = TRUE),
  
  dashboardBody(
    
    useShinyjs(),
    
    h2("Department Emergency Cover Rota"),
    
    fluidRow(
      
      column(width = 4,
             selectizeInput("consultant", label = "Consultant Name", 
                            choices = list("Begin by Typing Your name" = "", 
                                           "Name" = consultants_list), 
                            multiple = FALSE, selected = "")
      ),
      
      
    ),
    
    fluidRow(
      column(width = 4, 
             dateInput("shift_date", 
                       label = "Date of Shift Covered",
                       value = Sys.Date()
             )
      )
      
      
    ),
    
    
    fluidRow(
      
      
      column(width = 6,
             
             div(id = "submission",
                 
                 helpText("Please ensure name and date are correct before submitting, 
                          it can only be un-done manually by going back to a backup"),
                 
                 actionButton("submit", label = "Submit")),
             
             helpText("If you have made a mistake, please let dev know as soon as possible"))
      
      
    ),
    
    fluidRow(
      
      column(width = 5,
             
             htmlOutput("rota.kable.legacy")
             
      )
      
    )
    
  )
  
  
)

server <- function(input, output, session){
  
  
  new_rota <- eventReactive(
    input$submit,{
      
      disaster_new <- 
        rearrange(input$consultant, input$shift_date, disaster)
      
    } 
  )
  
  observeEvent(
    input$submit, {
      
      sheet_write(data = new_rota(),
                  ss = current_id,
                  sheet = "Sheet1")
      shinyjs::toggle(id = "submission", anim = T)
    }
  )
  
  
  
  output$rota.kable.legacy <- renderText({

    data <- disaster %>%
      select(Position = order,
             Name = name,
             "Date of Last Cover" = date_of_cover)

    kable(data, format = "html", escape = F) %>%
      kable_styling(full_width = F, font_size = 14) %>%
      column_spec(1, bold = T)

  })

  output$rota.kable.new <- renderText({

    data <- new_rota() %>%
      select(Position = order,
             Name = name,
             "Date of Last Cover" = date_of_cover)

    kable(data, format = "html", escape = F) %>%
      kable_styling(full_width = F, font_size = 14) %>%
      column_spec(1, bold = T)

  })

}

shinyApp(ui, server)

Should I simply try to use shinyjs to toggle between the 2 tables (kables) or is there a different way fo doing this?
I thought about using this in the server from a Stackoverflow post:

whichkable <- reactiveVal(TRUE)

kable.legacy <- disaster %>% 
  select(Position = order,
         Name = name,
         "Date of Last Cover" = date_of_cover) %>% 
  kable(format = "html", escape = F) %>%
  kable_styling(full_width = F, font_size = 14) %>%
  column_spec(1, bold = T)

kable.new <- new_rota() %>% 
  select(Position = order,
         Name = name,
         "Date of Last Cover" = date_of_cover) %>% 
  kable(format = "html", escape = F) %>%
  kable_styling(full_width = F, font_size = 14) %>%
  column_spec(1, bold = T)

which_kable <- reactive({
  
  if(which_kable()){
    kable.legacy
  }else{
    kable.new
  }
  
})

output$rota.kable <- renderText({
  which_kable()
})

but the app crashes because I am trying to create kable.new with reactive data? Thanks for your time.

Hello!

I'm trying to understand your issue a bit better. Are you just looking to update the table with the new row upon clicking the action button, or are you looking to display a completely new table. And if the latter, would pressing the button restore the other table, essentially allowing you to toggle between two separate tables?

Hi,

I think I want it to display a completely different table as I have had to alter the code so that the order of the table will take into the date of the shift covered into account. Anyway, I might have found a solution by simply using shinyjs to toggle the visibility of the 2 tables when submit is pressed.

I am still keen to learn a different way of doing this if you are willing to help. As I mentioned, I am still very much an occasional coder and keen to learn.

BW,

L

Your way is probably best. I would have suggested a workaround using observeEvent with some sort of global TRUE/FALSE variable to render one of two separate tables. If you found built in functionality to do this, however, than by all means, go with that.

1 Like

This topic was automatically closed 54 days after the last reply. New replies are no longer allowed.

If you have a query related to it or one of the replies, start a new topic and refer back with a link.