Carlos Junior
Carlos Junior

Reputation: 67

How to position two objects together in the bottom of a wellPanel in shiny?

I want to place the text inside p() function and the Download button in the bottom of this wellPanel, but cannot do so. What should I do here?

Using this div command allowed me to place one of them at the bottom, but can't do both without them kind of overlaping each other.

header <- dashboardHeader(title = "npx Chart")

sidebar <- dashboardSidebar({
  sidebarMenu(id = "menu",
              menuItem("Phase I", tabName = "ph1", icon = icon("vial"), startExpanded = FALSE,
                       menuSubItem("Data", tabName = "yourdata", icon = icon("file-excel")))
  )
})

body <- dashboardBody({
  
  tabItems(
    
    tabItem(tabName = "yourdata",
            fluidPage(
              fluidRow(
                column(4,
                       wellPanel(div(style = "height:800px; position:relative;",
                                     selectInput(inputId = "dataset", "Choose a Control Chart:",
                                                 choices = c("np Control Chart")),
                                     
                                     fileInput(inputId = "Ph1Data", "Choose Phase I data (Excel file only)",
                                               accept = c(".xlsx")),
                                     
                                     sliderInput(inputId = "chooseARL0",
                                                 label = "Choose a Phase II In-Control Average run Lenght (ARL0)",
                                                 min = 100,
                                                 max = 1000,
                                                 value = 370),
                                     
                                     p("If you do not have a process to monitor but want to know how the app works, you can 
                                  download a file to test here",
                                       style = "font-size: 12pt; position: absolute; bottom: 0;left: 0;", align = "justify"),        
                                     downloadButton("botao", "Download")
                       ))),
                column(8,
                       (DT::dataTableOutput("table_data"))
                )
              )))
  )
  
})

Upvotes: 0

Views: 426

Answers (1)

St&#233;phane Laurent
St&#233;phane Laurent

Reputation: 84529

Group the p tag and the downloadButton in a div, and set the positioning style to this div:

          div(
            style = "position: absolute; bottom: 0; left: 0;",
            p("If you do not have a process to monitor but want to know how the app works, you can
                              download a file to test here",
              style = "font-size: 12pt;", align = "justify"
            ),
            downloadButton("botao", "Download")
          )

Upvotes: 1

Related Questions