具有可排序列顺序的反应性数据框

时间:2017-08-18 14:45:04

标签: r jquery-ui shiny jquery-ui-sortable

在这个闪亮的应用程序中,用户可以选择一个数据集,显示一个数据集,用户可以对列的顺序进行排序(感谢shinyjqui):

library(shiny)
library(shinyjqui)
library(googleVis)

ui <- shinyUI(fluidPage(
  sidebarLayout(
    sidebarPanel(
      selectInput("dataset", "Select a dataset", 
                  choices = c("iris", "mtcars")), 
      uiOutput("sortable")
    ),
    #
    mainPanel(
      htmlOutput("gvtable")
    )
  )
))

server <- shinyServer(function(input, output) {

  Dat <- reactive({
    switch(input$dataset, 
           iris = iris, 
           mtcars = mtcars)
  })

  output$sortable <- renderUI({
    jqui_sortabled(
      do.call(function(...) tags$ul(id="list", ...), 
              lapply(colnames(Dat()), function(col) tags$li(col))) 
    )
  })

  output$gvtable <- renderGvis({
    validate(need(input$list_order, message=FALSE))
    if(all(input$list_order[["html"]] %in% names(Dat()))){
      colOrder <- input$list_order[["html"]]
    }else{
      colOrder <- names(Dat())
    }
    gvisTable(Dat()[, colOrder], 
              options = list(
                gvis.editor="Edit me!", 
                page="enable")
    )
  })

})

runApp(list(ui=ui, server=server))

当我运行应用程序时,此工作正常:显示iris数据集,我可以使用列顺序播放(侧边栏中的列列表是可排序的):

enter image description here

但是当我选择其他数据集时,列列表不可排序。为什么以及如何解决这个问题?

2 个答案:

答案 0 :(得分:1)

这可以通过为可排序列表使用不同的ID来实现:

  randomID <- eventReactive(Dat(), {
    paste0("list", rpois(1, 1000))
  })

  output$sortable <- renderUI({
    jqui_sortabled(
      do.call(function(...) tags$ul(id=randomID(), ...), 
              lapply(colnames(Dat()), function(col) tags$li(col))) 
    )
  })

  output$gvtable <- renderGvis({
    validate(need(input[[paste0(randomID(), "_order")]], message=FALSE))
    columns <- input[[paste0(randomID(), "_order")]][["html"]]
    if(all(columns %in% names(Dat()))){
      colOrder <- columns
    }else{
      colOrder <- names(Dat())
    }
    gvisTable(Dat()[, colOrder], 
              options = list(
                gvis.editor="Edit me!", 
                page="enable")
    )
  })

答案 1 :(得分:0)

这是 var top = main.offsetTop; main.style.top = top - 100 + '%'; v0.2.0的错误,已在Github的开发版本中修复。您可以在将较新版本提交给CRAN之前尝试。