How to render dynamic object outputs horizontally instead of vertically? - r

Question

The below code is "dynamic" in allowing the user to render additional independent tables with the click of the action button. For the sake of brevity, the below code has certain features removed such as table deletion, table column summation, etc.
When running the code note how added tables are rendered vertically. How could I render added tables horizontally instead of vertically?
I ordinarily render horizontally by using Shiny's grid layout, setting up columns, etc. But since these tables are dynamically rendered with the number of tables an unknown, I don't know how to do this.
Code:
library(rhandsontable)
library(shiny)
rowNames1 <- c("A", "B", "C", "Sum")
data1 <- data.frame(row.names = rowNames1, "Col 1" = c(1, 1, 0, 2), check.names = FALSE)
ui <- fluidPage(
rHandsontableOutput("hottable1"),
actionButton("addTbl", "Add table"),
tags$div(id = "placeholder")
)
server <- function(input, output) {
uiTbl1 <- reactiveValues(base = data1)
observeEvent(input$hottable1,{uiTbl1$base <- hot_to_r(input$hottable1)})
output$hottable1 <- renderRHandsontable({
rhandsontable(uiTbl1$base, rowHeaderWidth = 100, useTypes = TRUE)
})
observeEvent(input$addTbl, {
divID <- gsub("\\.", "", format(Sys.time(), "%H%M%OS3"))
dtID <- paste0(divID, "DT")
uiTbl1[[paste0(divID,"tbl")]] <- data1
insertUI(
selector = "#placeholder",
ui = tags$div(
id = divID,
rHandsontableOutput(dtID),
hr()
)
)
output[[dtID]] <- renderRHandsontable({
req(uiTbl1[[paste0(divID,"tbl")]])
rhandsontable(uiTbl1[[paste0(divID,"tbl")]], rowHeaderWidth = 100, useTypes = TRUE)
})
})
}
shinyApp(ui, server)

Answer 1

Try this:
insertUI(
selector = "#placeholder",
ui = tags$div(
id = divID,
style = "display: inline-block;",
rHandsontableOutput(dtID),
hr()
)
)
Not tested... perhaps you'll have to set the width.