I am looking for help please to observe when a button in the navbar of a Shiny App with navbarPage is clicked.
I have included a button right in the Shiny navbar with some javascript. I have provided an id to the button tag (‘id = btn_show’) and have introduced an observeevent to listen for ‘input$btn_show’. The button isn’t being observed though… what is required please? Thanks
library(shiny)
library(shinyjs)
ui <- navbarPage(
title = 'Button Up',
tabPanel('Tab 1'),
tabPanel('Tab 1')
, tags$script(HTML(
"var header = $('.navbar> .container-fluid');
header.append('<div style=\"float:right; style=\"valign:middle;\"><button id = \"btn_show\">Show Controls</button></div>');
console.log(header)"))
)
server <- function(input, output, session) {
observeEvent(input$btn_show,{
print('The button was observed')
})
}
shinyApp(ui, server)
Add the onclick attribute to your button:
<button id=\"btn_show\" onclick=\"Shiny.setInputValue(\\\"btn_show\\\", true, {priority: \\\"event\\\"})\">Show Controls</button>
I'm not sure the triple backslashes will work. If not, define a function:
function f(){
Shiny.setInputValue(\"btn_show\", true, {priority: \"event\"})
}
Then onclick = \"f()\".
Works like this:
tags$script(HTML(
"var header = $('.navbar> .container-fluid');
var f = function(){Shiny.setInputValue(\"btn_show\", true, {priority: \"event\"})};
header.append('<div style=\"float:right; valign:middle;\"><button id=\"btn_show\" onclick=\"f()\">Show Controls</button></div>');
console.log(header)"))