DT 中 numericInput 的垂直对齐
Vertical alignment of numericInput in DT
我一直在尝试垂直对齐 dt 呈现的数据框中的元素,为此我在 datatable
函数的选项中使用了 className = "dt-center"
参数,而这适用于我的数据框的大部分元素,它都没有将 numericInput 居中。
我尝试将 "vertical-align" = "middle"
css 参数与 formatStyle
函数一起使用,但这也不会改变 numericInput 的对齐方式。
是否有办法像文本的其余部分一样对齐这些 numericInput?
编辑:添加了所需对齐方式的屏幕截图
library(shiny)
shinyInput <- function(FUN, len, id, ...) {
inputs <- character(len)
for (i in seq_len(len)) {
inputs[i] <- as.character(FUN(paste0(id, i), ...))
}
inputs
}
df <- iris
df$num <- shinyInput(numericInput, nrow(df), "num_", label = NULL, value=NULL)
ui <- dashboardBody(box(fluidPage(DT::dataTableOutput('DTdf'))))
server <- function(input, output){
dfDT <- reactive({df})
output$DTdf <- DT::renderDT({
datatable(dfDT(),
escape=F,
editable="all",
options = list(
columnDefs = list(list(className = "dt-center", targets="_all")),
preDrawCallback = JS('function() { Shiny.unbindAll(this.api().table().node()); }'),
drawCallback = JS('function() { Shiny.bindAll(this.api().table().node()); } '))) %>%
formatStyle(c(6), "vertical-align" = "middle")
})
}
shinyApp(ui=ui, server=server)
由于底部边距,数字输入向上移动。您可以在 CSS:
的帮助下将其删除
CSS <- HTML("td .form-group {margin-bottom: 0;}")
ui <- dashboardBody(
tags$head(tags$style(CSS)),
box(
fluidPage(
DT::dataTableOutput('DTdf')
)
)
)
我一直在尝试垂直对齐 dt 呈现的数据框中的元素,为此我在 datatable
函数的选项中使用了 className = "dt-center"
参数,而这适用于我的数据框的大部分元素,它都没有将 numericInput 居中。
我尝试将 "vertical-align" = "middle"
css 参数与 formatStyle
函数一起使用,但这也不会改变 numericInput 的对齐方式。
是否有办法像文本的其余部分一样对齐这些 numericInput?
编辑:添加了所需对齐方式的屏幕截图
library(shiny)
shinyInput <- function(FUN, len, id, ...) {
inputs <- character(len)
for (i in seq_len(len)) {
inputs[i] <- as.character(FUN(paste0(id, i), ...))
}
inputs
}
df <- iris
df$num <- shinyInput(numericInput, nrow(df), "num_", label = NULL, value=NULL)
ui <- dashboardBody(box(fluidPage(DT::dataTableOutput('DTdf'))))
server <- function(input, output){
dfDT <- reactive({df})
output$DTdf <- DT::renderDT({
datatable(dfDT(),
escape=F,
editable="all",
options = list(
columnDefs = list(list(className = "dt-center", targets="_all")),
preDrawCallback = JS('function() { Shiny.unbindAll(this.api().table().node()); }'),
drawCallback = JS('function() { Shiny.bindAll(this.api().table().node()); } '))) %>%
formatStyle(c(6), "vertical-align" = "middle")
})
}
shinyApp(ui=ui, server=server)
由于底部边距,数字输入向上移动。您可以在 CSS:
的帮助下将其删除CSS <- HTML("td .form-group {margin-bottom: 0;}")
ui <- dashboardBody(
tags$head(tags$style(CSS)),
box(
fluidPage(
DT::dataTableOutput('DTdf')
)
)
)