My goal is to initiate a modal window by double-clicking on a cell within a reactable table. Additionally, I need the row index to display an image specific to the clicked row in the modal.
The code below successfully triggers a window.alert when a double click occurs in the last column. However, I find it easier to implement a modal window due to its additional options and my familiarity with coding in R rather than JavaScript.
library(shiny)
library(tidyverse)
library(reactable)
ui <- fluidPage(
fluidRow(
column(12, align = 'center',reactableOutput("tbl"))
)
)
server <- function(input, output, session) {
data = reactive({mtcars %>% tibble::rownames_to_column('car')})
output$tbl = renderReactable(
reactable(
data(),
columns = list(
carb = colDef(
sticky = "right",
sortable = FALSE,
cell = function(value, index, name){
icon("globe",
ondblclick = sprintf("window.alert('double clicked cell %s in column %s')", index, name)
)
})
),
compact = T,
highlight = T,
onClick = JS(" function(rowInfo, colInfo, column) {
if (colInfo.id !== 'carb') {
Shiny.setInputValue('qwert', {id:rowInfo.id, nonce:Math.random()});
}
}"),
rowStyle = list(cursor = "pointer")
)
)
observeEvent(input$qwert, {
print(input$qwert)
id <- input$qwert$id
row_nr <- as.numeric(id)+1
showModal(
modalDialog(
size = 'l',
easyClose = T,
title = data()$car[row_nr],
"some text"
)
)
})
observeEvent(input$poiu, {
print(input$poiu)
id2 <- input$poiu$id
row_nr2 <- as.numeric(id2)+1
showModal(
modalDialog(
title = data()$car[row_nr2],
"double click"
)
)
})
}
shinyApp(ui = ui, server = server)
I experimented with various approaches but none yielded the desired result:
sprintf(Shiny.setInputValue('poiu', {nonce:Math.random()}))
ondblclick = sprintf(Shiny.setInputValue('poiu', {id:%s.id, nonce:Math.random()}), index)
cell = function(value, index){ icon("globe", ondblclick = shinyjs::runjs(paste0("shiny.setInputValue('poiu',", index)) )}
If anyone could provide assistance or guidance, I would greatly appreciate it.
Thank you, Julie Reynolds