Disable sorting in pickerInput about shinywidgets HOT 12 CLOSED

This problem has also perplexed me for a long time, but seeing your discussion today give me a lot of inspiration, and finally I come up with a way to solve this problem.

To put it simply, we just need to create a reactiveValues to store the selection order, and use the reactive function to instantly process the selection and store it in reactiveValues sequentially.

Here is the demo:

library(shiny)

ui <- fluidPage(

    titlePanel("Setting the orders of pickerInput"),

    sidebarLayout(
        sidebarPanel(
            textOutput("ordered_text"), # output the selected terms to check the order
            uiOutput("picker") # UI output the pickerInput element
        ),
        mainPanel(
           dataTableOutput("df") # output the table of iris data that have sorted by column names by selected order
        )
    )
)

server <- function(input, output) {

    # create a pickerInput element
    output$picker <- renderUI({
        shinyWidgets::pickerInput(
            inputId = "colnames", label = "Column names:",
            choices = colnames(iris), multiple = T
        )
    })

    # create a reactiveValues to store the selected terms in the order of selection
    reV_order <- reactiveValues(values = NULL)

    # use reactive to get and sort the selected terms in the order of selection
    ordered_colnames <- reactive({
        if (length(reV_order$values) > length(input$colnames)) {
            reV_order$values <- reV_order$values[reV_order$values %in% input$colnames]
        }else {
            reV_order$values <- c(reV_order$values, input$colnames[!input$colnames %in% reV_order$values])
        }
        reV_order$values
    })

    observe({ ordered_colnames() }) # use an observe to update the reactive function above

    # output the selected terms
    output$ordered_text <- renderText({
        ordered_colnames()
    })

    # output the subset iris table that column was sorted in the order of selection
    output$df <- renderDataTable({
        if (length(ordered_colnames()) == 0) {
            return(NULL)
        }else if (length(ordered_colnames()) == 1) {
            head(subset(iris, select = ordered_colnames()), 5)
        }else {
            head(iris[, ordered_colnames()], 5)
        }
    })
}

shinyApp(ui = ui, server = server)

As shown in the following figure, the original column name order of iris is Sepal.Length Sepal.Width Petal.Length Petal.Width Species, and when I select it in the opposite order, although the order in pickerInput has not changed, the actual output order has changed (see the textOutput above of pickerInput), and you can see the change in column name order in the data.frame.

from shinywidgets.

Are you refering to pickerInput with multiple = TRUE ?
Can you provide an example ?

from shinywidgets.

Yes, s/he is. I believe pickerInput doesn't capture order of selection. My humble advice would be to use a rank-order input; albeit I've never done that in shiny, apart from numeric inputs with sendSweetAlert validation warnings - my solution isn't elegant.

from shinywidgets.

Hi @xental were you able to solve this problem? I am having the same issue. I would like to disable the automatic sorting. Let me know! Thanks!

from shinywidgets.

Hi @pvictor I am having the same issue with the automatic sorting of multiple values when multiple = TRUE.

pickerInput("Commodity", "Commodity Type", choices = c("Bauxite", "Diamonds" "Gold"), multiple = TRUE, options = list(actions-box = TRUE))

The issue I am having is that when I select one of the choices in the dropdown menu, the list of what is currently being selected does not show up in the order of selection. Instead, it shows up in alphabetical order (See attached photo).

If you could get back to me as soon as possible that would be great!

from shinywidgets.

Hello,

@xental , @cuso15 did you find solution to disable the autosorting in PickerInput. I am having the same issue. I want to capture the order of items based on they get selected in pickerInput.

Any idea?

Thanks,

from shinywidgets.

This feature isn't currently supported by bootstrap-select (the JavaScript library behind pickerInput), but has been requested several times (see snapappointments/bootstrap-select#2119) so it might be planned in the future.

Victor

from shinywidgets.

You can save order in another object

order <- c() if(length(input$picker)>length(order)) order <- c(order, input$picker[length(input$picker)]) if(length(input$picker)<length(order)) order <- which(order %in% input$picker)

from shinywidgets.

You can save order in another object

order <- c() if(length(input$picker)>length(order)) order <- c(order, input$picker[length(input$picker)]) if(length(input$picker)<length(order)) order <- which(order %in% input$picker)

input$picker[length(input$picker)] <-- this part assumes that the last item in input$picker is the most recently selected one, which is not true since selections are automatically sorted.

from shinywidgets.

Has anybody figured out a solution for this problem? Many thanks in advance! @pvictor

from shinywidgets.

Note that in shinyWidgets 0.7.0 there's a new widget virtualSelectInput with that functionnality:

library(shiny)
library(shinyWidgets)

ui <- fluidPage(
  fluidRow(
    column(
      width = 6, 
      pickerInput(
        inputId = "picker", 
        label = "Select values",
        choices = c(1, 2, 3, 4, 5),
        multiple = TRUE
      ), 
      virtualSelectInput(
        inputId = "virtualselect", 
        label = "Select values",
        choices = c(1, 2, 3, 4, 5),
        multiple = TRUE
      )
    ),
    column(
      width = 6, 
      verbatimTextOutput("result_picker"), 
      verbatimTextOutput("result_virtualselect")
    )
  )
)

server <- function(input, output, session) {
  output$result_picker <- renderPrint(input$picker)
  output$result_virtualselect <- renderPrint(input$virtualselect)
}

shinyApp(ui, server)

from shinywidgets.

@pvictor Thank you for providing this great function, but there is a bug when using virtualSelectInput before numericRangeInput. The input area of numericRangeInput function will float to the dropdown window of virtualSelectInput, see the screenshot below:

Modify the css could fix this problem:

.input-group .form-control {
/* position: relative; */ # set position value from relative to static
position: static;
z-index: 2;
float: left;
width: 100%;
margin-bottom: 0;
}

from shinywidgets.