使用 JS 增加 Shiny DT 表中搜索框的大小

Question

继这篇文章之后。在下面的示例中，如何在 JS 调用中增加搜索框的大小？

我想将搜索框的大小增加到当前长度的 4 倍？是否有可能实现这种场景？

library(shiny)

library(DT)

callback <- '

var x = document.createElement("INPUT");

x.setAttribute("type", "text");

x.setAttribute("id", "mySearch");

x.setAttribute("placeholder", "Search");

x.style.float = "right";

$("div.search").append($(x));

$("#mySearch").on("keyup redraw", function(){

  var splits = $("#mySearch").val().split(" ").filter(function(x){return x !=="";})

  var searchString = "(" + splits.join("|") + ")";

  table.search(searchString, true).draw(true);

});

'

ui <- fluidPage(

  DTOutput("dtable")

)

server <- function(input, output){

  output[["dtable"]] <- renderDT({

    datatable(

      iris[c(1,2,51,52,101,102),],

      options = list(

        dom = "l<'search'>rtip"

      ),

      callback = JS(callback)

    )

  }, server = FALSE)

}

shinyApp(ui, server)

会话信息：

R version 3.6.3 (2020-02-29)

Platform: x86_64-apple-darwin15.6.0 (64-bit)

Running under: macOS High Sierra 10.13.6

Matrix products: default

BLAS:   /System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libBLAS.dylib

LAPACK: /Library/Frameworks/R.framework/Versions/3.6/Resources/lib/libRlapack.dylib

locale:

[1] en_GB.UTF-8/en_GB.UTF-8/en_GB.UTF-8/C/en_GB.UTF-8/en_GB.UTF-8

attached base packages:

[1] stats4    parallel  stats     graphics  grDevices utils     datasets  methods  

[9] base     

other attached packages:

 [1] ggplot2_3.3.0        DT_0.13              rsconnect_0.8.16     shinythemes_1.1.2   

 [5] dplyr_0.8.5          shiny_1.4.0.2        BiocParallel_1.20.1  MLInterfaces_1.66.5 

 [9] cluster_2.1.0        annotate_1.64.0      XML_3.99-0.3         AnnotationDbi_1.48.0

[13] IRanges_2.20.2       MSnbase_2.12.0       ProtGenerics_1.18.0  S4Vectors_0.24.4    

[17] mzR_2.20.0           Rcpp_1.0.4.6         Biobase_2.46.0       BiocGenerics_0.32.0 

Answer 1

感谢您的意见。确实x.style.width = "50%";在callback（之后x.style.float）工作。