In addition to the default close button, I would like to add a button located on the bottom left of my bsmodal.
I tried:
library(shiny)
library(shinyBS)
ui<-fluidPage(
actionButton("tabBut", "View Table"),
bsModal("modalExample", "Modal Example", "tabBut", size = "large",tags$div(class="modal-footer",tags$button(type="button",class="btn btn-primary mr-auto","data-dismiss"="modal","Done")))
)
server<-function(input, output){
}
shinyApp(ui=ui,server=server)
On way to handle this would be to use shiny showModal and modalDialog as shown in the below example:
library(shiny)
library(shinyBS)
ui<-fluidPage(
actionButton("tabBut", "View Table"),
#bsModal("modalExample", "Modal Example", "tabBut", size = "large",tags$div(class="modal-footer",tags$button(type="button",class="btn btn-primary mr-auto","data-dismiss"="modal","Done")))
)
server<-function(input, output){
observeEvent(input$tabBut, {
showModal(
modalDialog(
title = 'Modal Example',
footer = tagList(
actionButton("done", "Some button for Done"),
modalButton('Close')
)
)
)
})
}
shinyApp(ui=ui,server=server)
Related
I have a simple app and want to add custom icons to my TabPanels
See code
library(shiny)
ui <- fluidPage(
br(),
navlistPanel(
tabPanel('Menu1', icon = icon("bar-chart-o"),
'Menu One',
tags$img(src='svg/frame.svg', height='40', width='40')
),
tabPanel('Menu2',
icon = tags$img(src='svg/frame.svg', height='40', width='40'),
'Menu Two')
)
)
server <- function(input, output) {
}
# Run the application
shinyApp(ui = ui, server = server)
As you can see, the tag is working well and I can see the svg image (in www/svg)
However it does not render the icon for Menu 2.
Quick solution is
title = div(img(src="svg/frame.svg"), "My Title")
library(shiny)
ui <- fluidPage(
br(),
navlistPanel(
tabPanel('Menu1', icon = icon("bar-chart-o"),
'Menu One',
tags$img(src='https://www.svgrepo.com/show/5840/like.svg', height='40', width='40')
),
tabPanel(div(img(src='https://www.svgrepo.com/show/5840/like.svg', height='20', width='20'), "Menu2"),
'Menu Two')
)
)
server <- function(input, output) {
}
# Run the application
shinyApp(ui = ui, server = server)
I successfully changed the text sizes in shiny dashboard interface by editing css file.
Or I use following structure:
div(DTOutput(outputId = "table"), style = "font-size:85%"))
However, I couldn't find the node name of shiny modals. Is it possible to change the text size in shiny modals through .css?
Are you looking for something like this?
shinyApp(
ui = basicPage(
actionButton("show", "Show modal dialog")
),
server = function(input, output) {
observeEvent(input$show, {
showModal(modalDialog(
title = "Important message",
div("This is an important message!", style="font-size:160%")
))
})
}
)
ModalDialog takes as its first argument(s) UI elements. This appears to be the same kind of arguments accepted by other shiny elements. Compare for example: ?siderbarPanel and ?modalDialog. So if you can do it in the body of an app, you can probably do it in a modal.
For example, I stuck a sidebar layout inside a modal:
shinyApp(
ui = basicPage(
actionButton("show", "Show modal dialog")
),
server = function(input, output) {
observeEvent(input$show, {
showModal(modalDialog(
sidebarLayout(sidebarPanel("yeah"),mainPanel("cool"))
))
})
}
)
A bsModal window in shiny app comes with a default Close button. Is there a way that can be disabled? I tried to look up on SO for similar questions, but didn't find one matching my requirements. I think, if a user can close the window using the top right corner X button, there is not really a need for another Close button. Please advise. Following reproducible code will generate a sample bsModal window to understand my question.
library(shiny)
library(shinyBS)
if(interactive()){
shinyApp(
ui <- fluidPage(
actionButton("open", "Open"), #action button to trigger the modal window.
bsModal("id1", "Box 1", "open", size = "small",
HTML(paste("A simple modal window."))
)
),
server <- function(input,output,session){
}
)
}
This should do it
library(shiny)
library(shinyBS)
if(interactive()){
shinyApp(
ui <- fluidPage(
actionButton("open", "Open"), #action button to trigger the modal window.
bsModal("id1", "Box 1", "open", size = "small",
HTML(paste("A simple modal window.")),
tags$head(tags$style("#id1 .modal-footer{ display:none}"))
)
),
server <- function(input,output,session){
}
)
}
Alternatively to #PorkChop's solution, you can write the modal without shinyBS:
library(shiny)
shinyApp(
ui <- fluidPage(
tags$button(class="btn btn-default",
"data-toggle"="modal", "data-target"="#simplemodal",
"Open modal"),
tags$div(
id = "simplemodal",
class="modal fade", role="dialog",
tags$div(
class="modal-dialog",
tags$div(
class="modal-content",
#### Header ####
tags$div(
class="modal-header",
tags$button(
type="button", class="close", "data-dismiss"="modal",
HTML("×")
)
),
#### Body ####
tags$div(
class="modal-body",
HTML("A simple modal window")
),
#### Footer (remove it if you want) ####
tags$div(
class="modal-footer",
tags$button(
type="button", class="btn btn-default", "data-dismiss"="modal",
"Close"
)
)
)
)
)
),
server <- function(input,output,session){
}
)
In my shiny app I would like to have a popup window with some text. To make the text more readable I would like to include some linebreaks, but so far I have failed. Any idea how would I do that? I am currently using modalDialog()
ui = basicPage(
actionButton("show", "Show modal dialog")
),
server = function(input, output) {
observeEvent(input$show, {
showModal(modalDialog(
title = "My text",
"This is the first line.
This should be the second."
))
})
}
I have tried: br(), \n and several variations of those. Nothing worked.
Help!!!
You can wrap it in HTML() and then use <br>, similar to your attempt mentioned above. So you could use instead: HTML("This is the first line.<br>
This should be the second.")
For the full app, see below:
ui = basicPage(
actionButton("show", "Show modal dialog")
)
server = function(input, output) {
observeEvent(input$show, {
showModal(modalDialog(
title = "My text",
HTML("This is the first line.<br>
This should be the second.")
))
})
}
shinyApp(ui, server)
I've been trying to use shinyBS modals with dateInput. The problem is that the calendar widget is hidden behind the modal. Here is my example code:
library(shiny)
library(shinyBS)
shinyApp(
ui =fluidPage(
mainPanel(
actionButton("button", label = "Open Modal"),
bsModal("modalExample", "Data Table", "rowtogg", size = "small",
fluidPage(dateInput("dates", "Enter date")))
)
),
server = function(input, output, session) {
observeEvent({
input$button
},{
toggleModal(session, "modalExample", "open")
})
}
)
A screenshot of the problem can be found at: https://github.com/ebailey78/shinyBS/issues/46, where I already asked the question. However it seems to me like this is a more "general" problem, so I was hoping someone over here could help me out.
EDIT: Thanks to Yenne Info it works by adding:
tags$style(type = "text/css", ".datepicker{z-index: 1100 !important;}"),