[英]DT Shiny different custom column header by column
我的CSS技能非常有限,但是假設以下示例:
sketch = htmltools::withTags(table(
class = 'display',
thead(
tr(
th(rowspan = 2, 'Species'),
th(colspan = 2, 'Sepal'),
th(colspan = 2, 'Petal')
),
tr(
lapply(rep(c('Length', 'Width'), 2), th)
)
)
))
datatable(head(iris, 10),
container = sketch, options = list(
initComplete = JS(
"function(settings, json) {",
"$(this.api().table().header()).css({'background-color': '#000', 'color': '#fff'});",
"}")
))
我如何將前兩個列標題的顏色編碼更改為藍色,以使列標題Sepal,Length
和Sepal,Width
兩行均為藍色,但將以下結構Petal,Length
和Petal,Width
保留為另一種顏色
在Stephane最初回答之后,我添加了一個示例。
您可以使用headerCallback
選項。
datatable(head(iris, 10),
container = sketch, options = list(
headerCallback = JS(
"function( thead, data, start, end, display ) {
$(thead).closest('thead').find('th').eq(3).css('color', 'red');
$(thead).closest('thead').find('th').eq(4).css('color', 'red');
$(thead).closest('thead').find('th').eq(5).css('color', 'blue');
$(thead).closest('thead').find('th').eq(6).css('color', 'blue');
}"
),
initComplete = JS(
"function(settings, json) {",
"$(this.api().table().header()).css({'background-color': '#000', 'color': '#fff'});",
"}")
))
標頭包含多行時,需要.closest('thead')
。
是你想要的嗎? 我不確定我是否正確理解了您的要求。
更改背景顏色:
library(DT)
sketch = htmltools::withTags(table(
class = 'display',
thead(
tr(
th(rowspan = 2, 'Species'),
th(colspan = 2, 'Sepal'),
th(colspan = 2, 'Petal')
),
tr(
lapply(rep(c('Length', 'Width'), 2), th)
)
)
))
headerCallback <- "function( thead, data, start, end, display ) {
$(thead).closest('thead').find('th').eq(0).css('background-color', 'green');
$(thead).closest('thead').find('th').eq(1).css('background-color', 'red');
$(thead).closest('thead').find('th').eq(2).css('background-color', 'blue');
$(thead).closest('thead').find('th').eq(3).css('background-color', 'red');
$(thead).closest('thead').find('th').eq(4).css('background-color', 'red');
$(thead).closest('thead').find('th').eq(5).css('background-color', 'blue');
$(thead).closest('thead').find('th').eq(6).css('background-color', 'blue');
}"
datatable(head(iris, 10),
container = sketch, options = list(
headerCallback = JS(headerCallback)
)
)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.