r - Why does content not appear in bsModal when coming from server? -

for reason displaying of bsmodal content seems go wrong when triggered observeevent server side, images , or text don't appear, , seems cause disabling of sweetalerts in cases (which prebuild modals).

i tagged shinyjs reason, since app includes interaction it. besides long post, , complicated issue, hope bsmodal part sweetalert coding shinyjs, copy of work dean attali may other people happen read this. if find useful, give post upvote.

a full app scenario 1, 2 , 3 found below. scenarios 4 , further not in full app, because cause other parts of app stop working add code. suggest try app @ end, , read through scenarios. (tried make clear possible.)

i'm using bsmodals add new functionality shiny program (very large complex app), , discovered strange while trying incorporate images bsmodals. did research when problem occurs, , present test app here several scenarios.

my primary issue:

for purposes need figure out why scenario 7b doesn't work, i.e. bsmodal server image , observeevent activate it, 2nd main question is, can somehow code trigger = input$button1 argument in bsmodal trigger = values$variable somehow? tried not figure out.

the main problem seems revolve around difference in behaviour of trigger = argument inside bsmodal() versus using observeevent() togglemodal()

scenario 1: works

this on ui side instance works fine:

i.e. modal appears, , sweetalert in app shows on start

 actionbutton("show1", "show modal 1"),  bsmodal(id= 'infomodal1',title = "this modal works", trigger = "show1", "triggered clicking button 1, trigger argument in ui code bsmodal without image"), 

scenario 2: works

adding image modal, still through ui side, works fine, image appears:

 actionbutton("show2", "show modal 2"),  bsmodal(id= 'infomodal2',title = "this modal works", trigger = "show2",                   img(src="https://www.rstudio.com/wp-content/uploads/2014/07/rstudio-logo-blue-gradient.png", width="550", height="200"),                   br(), "triggered clicking button 2, trigger argument in ui code bsmodal"), 

scenario 3: works partially

now try have triggered server side of things. usefull if instance needed have modal doesn't come button click, variable value changing. modal appears, , variation doesn't cause problems sweetalert, no text content in modal body!

ui side:

 actionbutton("show3", "show modal 3"),  bsmodal(id= 'infomodal3',title = "this modal works content text not show up!", "triggered clicking button 3, , use observeevent in server, without image"), 

server side:

observeevent(input$show3, { togglemodal(session, "infomodal3", toggle = "toggle")  }) 

scenario 4: not work @ all, , sweetalert broken too

if add image scenario 3, it's same result. add following code behind senario 3 code in ui , second observer server, and notice, if don't run rm(ui) first, of time ui wrong, i.e. without button nr 4

ui side

 actionbutton("show4", "show modal 4"),           bsmodal(id= 'infomodal4',title = "this modal works content image not show up!", img(src="https://www.rstudio.com/wp-content/uploads/2014/07/rstudio-logo-blue-gradient.png", width="550", height="200"),"triggered clicking button 4, trigger modal observeevent in server, without image") 

server side:

observeevent(input$show4, { togglemodal(session, "infomodal4", toggle = "toggle")  }) 

scenario 5: works -> build basic bsmodal renderui() trigger in server side

replace whole tabitems() section in working app in ui:

tabitems(       tabitem(tabname = 'tab1',               actionbutton("show5", "show modal 5"),               uioutput("mymodal5")     )))) 

and replace server with:

server <-  function(input, output, session) {    shinyjs::js$swal( title = '<span style="color:#339fff; font-size: 30px">finished loading app<span>',                     text = '<span style="color:black; font-size: 16px">version: 1.0.0 <br> written by: m.a. van dijk<span>',                     imageurl= "https://www.rstudio.com/wp-content/uploads/2014/07/rstudio-logo-blue-gradient.png" )    output$mymodal5 <- renderui({  bsmodal(id= 'infomodal5',title = "this modal works content text not show up!", trigger = "show5", " build server, , triggered clicking button 5 trigger argument in modal, without image") }) } 

scenario 6: works or without image, but.....

ui part :

tabitems(       tabitem(tabname = 'tab1',               actionbutton("show6", "show modal 6"),               uioutput("mymodal6")     )))) 

server part after swal function:

 output$mymodal6 <- renderui({ bsmodal(id= 'infomodal6',title = "this modal works , content text show up!", trigger = "show6", " build server, , triggered clicking button 6 , observeevent in server, without image") })  } 

or version of server image:

output$mymodal6 <- renderui({ bsmodal(id= 'infomodal6',title = "this modal works , content text show up!", trigger = "show6", img(src = "https://www.rstudio.com/wp-content/uploads/2014/07/rstudio-logo-blue-gradient.png", width="550", height="200"),                         "build server, , triggered clicking button 6 , trigger argument in bsmodal, image") }) 

*i can't use in program when want have modal triggered variable rather button click. that, should use observeevent next scenario, think. unless there way use "trigger = "some reactive value" *

scenario 7: works, without image, not with....

i found out work observeevent(input$show7) instead of trigger = "show7" in dummy app server, until add img(scr.... part. ui side:

tabitems(   tabitem(tabname = 'tab1',           actionbutton("show7", "show modal 7"),           uioutput("mymodal7") )))) 

server side

output$mymodal7 <- renderui({ bsmodal(id= 'infomodal7',title = "this modal works , content text show up!", "build server, , triggered clicking button 7 , trigger argument in bsmodal, image") })    observeevent(input$show7, { togglemodal(session, "infomodal7", toggle = "toggle")  }) 

. .to add image, replace output$modal7

output$mymodal7 <- renderui({ bsmodal(id= 'infomodal7',title = "this modal doesn't work",                                   img(src="https://www.rstudio.com/wp-content/uploads/2014/07/rstudio-logo-blue-gradient.png", width="550", height="200"),                                         "build server, , triggered clicking button 7 , trigger argument in bsmodal, image") }) 

. . .

working app scenario 1, 2 , 3:

library(shiny) library(shinybs) library(shinyjs)  jscode <- " shinyjs.swal = function(params) {    var defaultparams = { title: null, text : null, imageurl: null }; params = shinyjs.getparams(params, defaultparams); swal({title : params.title, text : params.text,  imageurl : params.imageurl, imagesize: '400x400',   html: true, showcancelbutton : false, showconfirmbutton : true, closeonconfirm: true, confirmbuttoncolor: '#339fff', allowoutsideclick: true   }); };"  ui <- shinydashboard::dashboardpage(    dashboardheader(title = "dummy app"),     dashboardsidebar(       tags$head(         tags$script(src = "https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.0.1/sweetalert.min.js"),   ### code sweetalerts         tags$link(rel = "stylesheet", type = "text/css",                                                  ### code sweetalerts                 href = "https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.0.1/sweetalert.min.css")    ### code sweetalerts         ),    sidebarmenu(id = 'sidebarmenu',                 menuitem("my tab", tabname = 'tab1'))),    dashboardbody(     shinyjs::useshinyjs(),     ### code sweetalerts     shinyjs::extendshinyjs(text = jscode),  ### code sweetalerts      tabitems(       tabitem(tabname = 'tab1',            actionbutton("show1", "show modal 1"),           bsmodal(id= 'infomodal1',title = "this modal works", trigger = "show1", "triggered clicking button 1, trigger argument in ui code bsmodal without image"),            actionbutton("show2", "show modal 2"),           bsmodal(id= 'infomodal2',title = "this modal works", trigger = "show2",                   img(src="https://www.rstudio.com/wp-content/uploads/2014/07/rstudio-logo-blue-gradient.png", width="550", height="200"),                   br(), "triggered clicking button 2, trigger argument in ui code bsmodal"),            actionbutton("show3", "show modal 3"),                bsmodal(id= 'infomodal3',title = "this modal works content text not show up!", "triggered clicking button 3, trigger modal observeevent in server, without image")        ))))  server <-  function(input, output, session) {    shinyjs::js$swal( title = '<span style="color:#339fff; font-size: 30px">finished loading app<span>',                      text = '<span style="color:black; font-size: 16px">version: 1.0.0 <br> written by: m.a. van dijk<span>',                      imageurl= "https://www.rstudio.com/wp-content/uploads/2014/07/rstudio-logo-blue-gradient.png" )      observeevent(input$show3, { togglemodal(session, "infomodal3", toggle = "toggle")  })   } shinyapp(ui = ui, server = server)