rank list中的R shiny sortable clone元素不工作

yws3nbqq  于 2023-10-13  发布在  其他
关注(0)|答案(1)|浏览(79)

我有一个闪亮的应用程序,用户上传一个CSV文件。然后,使用csv文件中的列名创建sortable bucket list。我想从第一个排名列表中拖动列名,并将其克隆(即。未耗尽)。我尝试在add_rank_list()设置pull='clone'中使用options参数,但不起作用。你知道怎么做吗?下面是我的代码,一些假数据可以访问here

library(shiny)
library(shinyjs)
library(sortable)

ui <- fluidPage(
  
  titlePanel("App"),
  
  sidebarLayout(
    sidebarPanel(
      useShinyjs(),
      fileInput(inputId = "file1", label = "Select a .csv file", 
                accept = c("text/csv", "text/comma-separated-values,text/plain",".csv")
      ),
      uiOutput("show_button")
    ),
    
    mainPanel(
      DT::dataTableOutput("table")
    )
  ),
  
  fluidRow(uiOutput("buckets"))
  
)

server <- function(input, output) {
  
  # input csv file
  input_file <- reactive({
    if (is.null(input$file1)) {
      return("")
    }
    
    # actually read the file
    read.csv(file = input$file1$datapath)
  })
  
  
  
  # button to hide/show table
  
  ## only show when table is loaded
  output$show_button = renderUI({
    req(input$file1)
    actionButton(inputId = "button", label = "show / hide table")
  })
  
  ## observe the button being pressed
  observeEvent(input$button, {
    shinyjs::toggle("table")
  })
  
  
  
  # output table
  output$table <- DT::renderDataTable({
    
    # render only if there is data available
    req(input_file())
    
    # reactives are only callable inside an reactive context like render
    data <- input_file()
    data
    
  })

    
  # Drag and Drop Col names
  output$buckets = renderUI( 
    {
      # create list of colnames
      req(input$file1)
      data = input_file()
      cols = colnames(data)
      
      
      # create bucket list
      bucket_list(
        header = "Drag the items in any desired bucket",
        group_name = "bucket_list_group",
        orientation = "horizontal",
        
        
        add_rank_list(
          text = "Drag from here",
          labels = as.list(cols),
          input_id = "rank_list_1",
          css_id = "list1", 
          options = sortable_options(
            group = list(
              pull = "clone",
              name = "list_group1",
              put = FALSE))
        ),
        
        add_rank_list(
          text = "to here",
          labels = NULL,
          input_id = "rank_list_2",
          css_id = "list2", 
          options = sortable_options(group = list(name = "list_group1")))
      )
      
    })
  
  
}

# Run the application 
shinyApp(ui = ui, server = server)
qxgroojn

qxgroojn1#

试试这个.
我从官方article定制了这个

library(shiny)
library(sortable)

clone_list <- function(id, x) {
  tags$div(
    class = "default-sortable rank-list-container",
    id = id,
    lapply(
      x,
      function(x) {
        tags$div(
          class = "rank-list-item",
          style = "border-radius: 3px;
                display: block;
                padding: 10px 15px;
                background-color: #f8f8f8;
                border: 1px solid #ddd;
                cursor: grab;",
          tags$strong(x)
        )
      }
    )
  )
}

ui <- fluidPage(
  fluidRow(
    column(
      width = 12,
      style = "margin-bottom: 1em;",
      h5(icon("trash"), "Remove item"),
      tags$div(
        class = "default-sortable rank-list-container",
        tags$div(
          class = "panel-body",
          id = "sortable_bin"
        )
      )
    ),
    column(
      width = 3,
      h5("Variable Holder"),
      clone_list(id = "sort1", c("A", "B", "C", "D", "E"))
    ),
    column(
      width = 3,
      h5("Variable"),
      rank_list(
        text = NULL,
        labels = NULL,
        input_id = "group1",
        options = sortable_options(group = "sortGroup1"),
        orientation = "horizontal"
      )
    )
  ),
  sortable_js(
    "sort1", # Variable Holder
    options = sortable_options(
      group = list(
        name = "sortGroup1",
        pull = "clone",
        put = FALSE
      )
    )
  ),
  
  sortable_js(
    "sortable_bin", # Bin
    options = sortable_options(
      group = list(put = TRUE, pull = TRUE),
      onAdd = htmlwidgets::JS("function (evt) { this.el.removeChild(evt.item); }")
    )
  )
)

server <- function(input, output) {
}
shinyApp(ui, server)

相关问题