运行R Shiny应用程序时如何在datatable函数中编辑列名?

时间:2019-02-18 22:35:29

标签: r datatable shiny dt

我正在使用R Shiny中DT包中的datatable函数,并且希望我的应用程序的用户可以编辑列名(变量名)。有什么选择吗?

现在,我正在使用文本输入“ old_var_name”,文本输入“ new_var_name”和操作按钮“ update_variable_name”。但是在这一点上,我当时只能更改变量名。我希望用户能够更改他想要的变量名称。

服务器:

tab <- eventReactive(input$import,{
inFile <- input$file1
if (is.null(inFile))
  return(NULL)

tabledata <- read.xlsx(inFile$datapath,startRow=1,sheet = 1)
})

name_temp <- eventReactive(input$var_name,{
if (input$old_name == ""){
  colnames(tab())
} else {
    c(colnames(tab())[1:(which(colnames(tab()) == input$old_name)-1)],input$new_name,
    colnames(tab())[(which(colnames(tab()) == input$old_name)+1):length(colnames(tab()))])
}
})

final_rename <- reactive({
d <- tab()
colnames(d) <- name_temp()
d
})

output$tabledata <- DT::renderDataTable({
if (input$var_name == 0) {
  DT::datatable(tab(),editable = T)
} else {
  DT::datatable(final_rename(),editable = T)
}
})

UI:

tabPanel("Table",h1("Table",align="center") ,
actionButton(inputId = "import", label = "Import data"),br(),br(),                           
splitLayout(textInput(inputId = "old_name", label = "Old variable name"),                           
textInput(inputId = "new_name", label = "New variable Name")),
actionButton(inputId = "var_name", label = "Update Variable name"),br(),br(),
DT::dataTableOutput("tabledata"))

是否有建议实现该目标或我可以使用的带有数据表的任何选项,然后用户将能够更改他想要的所有变量名?

2 个答案:

答案 0 :(得分:0)

这是一种友好的方式,但它会干扰排序。因此,仅当禁用排序时,它才是不错的选择。双击列标题进行编辑,然后按Tab键进行转义。

library(DT)

callback <- c(
  "table.on('dblclick.dt', 'thead th', function(e) {",
  "  var $th = $(this);",
  "  var index = $th.index();",
  "  var colname = $th.text(), newcolname = colname;",
  "  var $input = $('<input type=\"text\">')",
  "  $input.val(colname);",
  "  $th.empty().append($input);",
  "  $input.on('change', function(){",
  "    newcolname = $input.val();",
  "    if(newcolname != colname){",
  "      $(table.column(index).header()).text(newcolname);",
  "    }",
  "    $input.remove();",
  "  }).on('blur', function(){",
  "    $(table.column(index).header()).text(newcolname);",
  "    $input.remove();",
  "  });",
  "});"
)

datatable(iris[1:3,], callback = JS(callback))

enter image description here

答案 1 :(得分:0)

这是带有上下文菜单的解决方案。右键单击列标题以对其进行编辑。完成后按“ Escape”,或将鼠标移至文本输入框之外。此解决方案不会干扰排序。

library(shiny)
library(DT)

callback <- c(
  "$.contextMenu({",
  "  selector: '#table th',", 
  "  trigger: 'right',",
  "  autoHide: true,",
  "  items: {",
  "    text: {",
  "      name: 'Enter column header:',", 
  "      type: 'text',", 
  "      value: ''", 
  "    }",
  "  },",
  "  events: {",
  "    show: function(opt){",
  "      $.contextMenu.setInputValues(opt, {text: opt.$trigger.text()});",
  "    },",
  "    hide: function(opt){",
  "      var $this = this;",
  "      var text = $.contextMenu.getInputValues(opt, $this.data()).text;",
  "      var $th = opt.$trigger;",
  "      $th.text(text);",
  "    }",
  "  }",
  "});" 
)

ui <- fluidPage(
  tags$head(
    tags$link(rel = "stylesheet", href = "https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.8.0/jquery.contextMenu.min.css"),
    tags$script(src = "https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.8.0/jquery.contextMenu.min.js")
  ),
  DTOutput("table")
)

server <- function(input, output){
  output[["table"]] <- renderDT({
    datatable(iris[1:3,], callback = JS(callback))
  }, server = FALSE)  
}

shinyApp(ui, server)

enter image description here