Customizing shinyjqui package

shiny
4

@MayaGans. The drop argument was not for draggable function. Add the droppable function to cloned to remove the clone when dropped.

library(shiny)
library(shinyjs)
library(shinyjqui)

ui <- fluidPage(
    tags$head(
        tags$script(
            "$( function() {
      $( '.drop_back' ).droppable({
      drop: function(e, ui) {
      $(ui.helper).remove();
      }
      })
      });
      
      $( function() {
        $( '.cloned' ).draggable({
        helper: 'clone',
        connectToSortable: '#dest',
        });
        $( '.cloned' ).droppable({
            drop: function(e, ui) {
                $(ui.helper).remove();
            }
        })
   });"
        )),
    
    sidebarPanel(
        fluidRow(column(4, h5("Drag Once"),
                        jqui_sortable(div(id = "source", div("Block", class="cloned",
                                                             style="background-color:grey;text-align:center;color:white;box-shadow: 0 0 10px rgba(0, 0, 0, 0.7)"),
                                          style = "border: 1px solid black;padding:10px;min-height:50px;"),
                                      options = list(connectWith = "#dest"))),
                 column(4, h5("Put Here"),
                        jqui_sortable(div(id = "dest", style = "border: 1px solid black;padding:10px;min-height:50px"),
                                      options = list(connectWith = "#source")))
        )
    )
)


server <- function(input, output, session) {
}

shinyApp(ui, server)
1 Like