html - 如何使用 DTedit 和 shiny::uiOutput 在列中引入新行？

Question

我正在使用 DTedit pckg 在 Shiny 的应用程序中显示数据框 (mydata)，因为这个简单的 R pckg 允许我以非常简单的方式添加/编辑行。到目前为止，一切都很好。但是，我想在 Var2 列中引入一个新行(或换行符)，将第一行与第二行分开，将第三行与第四行分开。

我已经能够使用 DT::dataTableOutput(下面的选项 1)做到这一点。但是，DTedit 似乎只能与 shiny::uiOutput 一起使用，而且我无法在那里引入新行(选项 2)。我读过有关 div() 的内容，但我现在完全一无所知。

有人可以阐明我如何使用 Dtedit 在数据框的列中引入新行吗？因此 shiny::uiOutput？

注意:我得出的结论是 shiny::uiOutput 是这里的问题，因为这是我在这两个选项之间看到的唯一“明显”区别。但这只是我，我可能缺少一些不那么明显的东西。

PD:这是我的第一篇文章，所以请告诉我是否可以做得更好。谢谢!

# OPTION 1: using DT (DT::dataTableOutput) (WORKING)

    ui = fluidPage(
      h3("New line works when using DT (DT::dataTableOutput)",
      mainPanel(
        DT::dataTableOutput("mytable")
        )
      )
    )

    server = function(input, output){

      #dataframe
      mydata <- data.frame(Var1 = c("a", "b"),
                           Var2 = c("FIRST LINE: first; SECOND LINE: second", 
                                    "THIRD LINE: third; FOUR LINE: four"))

      #Subtitute semicolon by break line based on 
      #https://stackoverflow.com/questions/26368192/how-to-insert-new-line-in-r-shiny-string
      mydata$Var2 <- gsub(pattern = "; ", replacement = "<br/>", mydata$Var2)

      #render table
      output$mytable = DT::renderDataTable(escape = F,
            mydata
        )
    }

shinyApp(ui = ui, server = server, options = list(height = 1080))

# OPTION 2: using DTedit, therefore shiny::uiOutput, (not working)

    ui = fluidPage(
      h3("New line does not work when using DTedit-shiny::uiOutput"),
      mainPanel(
        shiny::uiOutput("mytable")
      )
    )

    server = function(input, output){

      #dataframe
      mydata <- data.frame(Var1 = c("a", "b"),
                           Var2 = c("FIRST LINE: first; SECOND LINE: second", 
                                    "THIRD LINE: third; FOUR LINE: four"))

      #Subtitute semicolon by break line based on 
      #https://stackoverflow.com/questions/26368192/how-to-insert-new-line-in-r-shiny-string
      mydata$Var2 <- gsub(pattern = "; ", replacement = "<br/>", mydata$Var2)

      #render table
      output$mytable = DT::renderDataTable(escape = F,
                                           DTedit::dtedit(input, output,
                                                          name = 'mytable',
                                                          thedata = mydata)
      )

    }

shinyApp(ui = ui, server = server, options = list(height = 1080))

想要的结果:

Wanted outcome

到目前为止的实际结果:

Actual outcome

Answer 1

这通过在 render 函数中用 JavaScript 进行替换来实现:

server = function(input, output){

  #dataframe
  mydata <- data.frame(Var1 = c("a", "b"),
                       Var2 = c("FIRST LINE: first; SECOND LINE: second", 
                                "THIRD LINE: third; FOUR LINE: four"))

  #render table
  DTedit::dtedit(
    input, output,
    name = 'mytable',
    thedata = mydata, 
    datatable.options = list(
      columnDefs = list(
        list(targets=1, 
             render = JS("function(data){return data.replace(/;/g, '<br>');}"))
      )))

}